使用API之前,先申请应用key
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>HELLO WORLD</title>
<script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥"></script>
<script>
var map;
var zoom = 12;
function onLoad() {
map = new T.Map('mapDiv');
map.centerAndZoom(new T.LngLat(116.40769, 39.89945), zoom);
map.setMapType(TMAP_HYBRID_MAP);
}
</script>
</head>
<body onLoad="onLoad()">
<div id="mapDiv" style="position:absolute;width:500px; height:400px"></div>
</body>
</html>
1.在想要显示地图的html文件中引入天地图JavaScript API文件
2.创建地图容器元素
地图需要一个HTML元素作为容器,展现在页面上。
<!--创建一个id为mapDiv的div元素-->
<div id="mapDiv" style="position:absolute;width:100%; height:98%"></div>
3.创建地图实例
4.确定经纬度坐标
5.地图初始化
6.设置地图的类别
//卫星和路网的混合视图
map.setMapType(TMAP_HYBRID_MAP);
这需要这样几个步骤,一个卫星和路网混合的地图就出现在您的页面上了!!