您的位置：首页 > 运维架构

Openlayers加载在线地图

2016-06-12 19:47 483 查看

html代码一map.html：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Map</title>
<script type="text/javascript" src="js/OpenLayers-2.13.1/OpenLayers.js"></script>
</head>
<body>
<div id="map"></div>
<script type="text/javascript" src="js/test.js"></script>
</body>
</html>
html代码二test.html：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>load map</title>
<script type="text/javascript">
function init(){
var subframe = document.getElementById("subframe");
subframe.contentWindow.initMap();
}
</script>
</head>
<body onload="init()">
<iframe id="subframe" src="map.html" ></iframe>
</body>
</html>
js代码test.js

function initMap(){
Map = new OpenLayers.Map('map');
Map.addLayers(getGaodeMap());
//Map.addLayers(getGoogleMap());
Map.zoomTo(1);
}
function getGaodeMap(){
var gdlayer = new OpenLayers.Layer.XYZ("高德地图", [
"http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
"http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
"http://webrd03.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
"http://webrd04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}"
], {
isBaseLayer: true,
visibility: true,
displayInLayerSwitcher: true
});
return [gdlayer];
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： GIS Openlayers

相关文章推荐

新的分享

章节导航