天地图二维地图数据的接入
map.js
//--------------设置图层------------------------------
//------------------------矢量-----------------------------
ll= new GeoSurf.Layer.GlobeTile("A0512_EMap", "http://tile0.tianditu.com/services/A0512_EMap", {
transitionEffect: "resize",
topLevel: 2,
bottomLevel: 10,
maxExtent: new GeoSurf.Bounds(-180,-90,180,90)
});
ln= new GeoSurf.Layer.GlobeTile("B0627_EMap1112", "http://tile0.tianditu.com/services/B0627_EMap1112", {
transitionEffect: "resize",
topLevel: 11,
bottomLevel: 12,
maxExtent: new GeoSurf.Bounds(68.203125,0.3515625,140.009765625,58.18359375)
});
lo= new GeoSurf.Layer.GlobeTile("AB0512_Anno", "http://tile0.tianditu.com/services/AB0512_Anno", {
wrapDateLine: true,
transitionEffect: "resize",
topLevel: 2,
bottomLevel: 10,
maxExtent: new GeoSurf.Bounds(-180,-90,180,90)
});
lp = new GeoSurf.Layer.GlobeTile("siwei0608", "http://tile0.tianditu.com/services/siwei0608", {
transitionEffect: "resize",
topLevel: 13,
bottomLevel: 18,
maxExtent: new GeoSurf.Bounds(73.125,2.98828125,135.791015625,54.2724609375)
});
//-----------------------------影像-----------------------------------------
ml = new GeoSurf.Layer.GlobeTile("sbsm1518", "http://tile0.tianditu.com/services/sbsm1518", {
wrapDateLine: true,
topLevel: 15,
bottomLevel: 18,
maxExtent: new GeoSurf.Bounds(-180,-90,180,90)
});
mn = new GeoSurf.Layer.GlobeTile("eastdawnall", "http://tile0.tianditu.com/services/eastdawnall", {
topLevel: 14,
bottomLevel: 14,
maxExtent: new GeoSurf.Bounds(73.30078125,17.9296875,135.17578125,53.701171875)
});
mo = new GeoSurf.Layer.GlobeTile("el3", "http://tile0.tianditu.com/services/e13", {
topLevel: 13,
bottomLevel: 13,
maxExtent: new GeoSurf.Bounds(73.30078125,17.9736328125,135.1318359375,53.6572265625)
});
mp = new GeoSurf.Layer.GlobeTile("e12", "http://tile0.tianditu.com/services/e12", {
topLevel: 12,
bottomLevel: 12,
maxExtent: new GeoSurf.Bounds(73.30078125,17.9296875,135.17578125,53.701171875)
});
mq = new GeoSurf.Layer.GlobeTile("e11", "http://tile0.tianditu.com/services/e11", {
topLevel: 11,
bottomLevel: 11,
maxExtent: new GeoSurf.Bounds(73.30078125,17.9296875,135.17578125,53.7890625)
});
mr = new GeoSurf.Layer.GlobeTile("sbsm0210", "http://tile0.tianditu.com/services/sbsm0210", {
wrapDateLine: true,
topLevel: 2,
bottomLevel: 10,
maxExtent: new GeoSurf.Bounds(-180.0,-90.0,180.0,90.0)
});
//影像标注
ms = new GeoSurf.Layer.GlobeTile("siweiAnno68", "http://tile0.tianditu.com/services/siweiAnno68", {
topLevel: 15,
bottomLevel: 18,
maxExtent: new GeoSurf.Bounds(-180.0,-90.0,180.0,90.0)
});
mt = new GeoSurf.Layer.GlobeTile("B0530_eImgAnno", "http://tile1.tianditu.com/services/B0530_eImgAnno", {
topLevel: 11,
bottomLevel: 14,
maxExtent: new GeoSurf.Bounds(-180,-90,180,90)
});
mu = new GeoSurf.Layer.GlobeTile("A0610_ImgAnno", "http://tile1.tianditu.com/services/A0610_ImgAnno", {
wrapDateLine: true,
topLevel: 2,
bottomLevel: 10,
maxExtent: new GeoSurf.Bounds(-180,-90,180,90)
});
ll.setVisibility(false);
ln.setVisibility(false);
lo.setVisibility(false);
lp.setVisibility(false);
//--------------切换影像属性------------------------------------
function callmap(){
ml.setVisibility(false);
mn.setVisibility(false);
mo.setVisibility(false);
mp.setVisibility(false);
mq.setVisibility(false);
mr.setVisibility(false);
ms.setVisibility(false);
mt.setVisibility(false);
mu.setVisibility(false);
ll.setVisibility(true);
ln.setVisibility(true);
lo.setVisibility(true);
lp.setVisibility(true);
}
function callimg(){
ml.setVisibility(true);
mn.setVisibility(true);
mo.setVisibility(true);
mp.setVisibility(true);
mq.setVisibility(true);
mr.setVisibility(true);
ms.setVisibility(true);
mt.setVisibility(true);
mu.setVisibility(true);
ll.setVisibility(false);
ln.setVisibility(false);
lo.setVisibility(false);
lp.setVisibility(false);
}
//-----------------------华丽的分隔线----------------------------------
tianditu.html
<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=GBK"/>
<title>GeoSurf Maps</title>
<!--加载二维地图api-->
<script type="text/javascript" src="http://www.tianditu.cn/guide/lib/GeoSurfJSAPI.js"></script>
<script type="text/javascript" src="map.js"></script>
<script type="text/javascript">
var map;
function init() {
//创建地图对象
map = new GeoSurf.PortalMap("map");
//加载图层
map.addLayers([ll,ln,lo,lp,ml,mn,mo,mp,mq,mr,ms,mt,mu]);
//map.setBaseLayer(ln);
map.zoomToExtent(new GeoSurf.Bounds(73.30,17,135.65,52.32));
//map.setCenter(new GeoSurf.LonLat(116.41,39.90),8);
}
</script>
</head>
<body onload="init()">
<div align="right">
<input type="button" value="矢量" onclick="callmap()">
<input type="button" value="影像" onclick="callimg()">
</div>
<!--创建地图容器-->
<div id="map" style="width:800px;height:500px;border:1px solid gray"></div>
</body>
</html>