微信小程序如何调用天地图
时间: 2023-10-08 17:13:01 浏览: 747
微信小程序可以通过调用天地图的API实现地图展示和地图操作。以下是简单的步骤:
1. 在微信小程序后台注册并获取天地图开发者账号,并获得相应的API密钥。
2. 在小程序中引入天地图的JS API,可以通过CDN或者直接下载JS文件的方式引入。
3. 在小程序中创建地图容器,并设置地图的基本属性,如地图的中心点、缩放级别等。
4. 通过天地图提供的API调用地图相关的功能,如添加标注、绘制图形等。
以下是一个简单的示例代码,可供参考:
```
// 引入天地图JS API
import TMap from '../../libs/TMap';
Page({
data: {
// 地图容器的高度
mapHeight: wx.getSystemInfoSync().windowHeight - 50,
// 地图对象
map: null,
},
onLoad: function () {
// 创建地图容器
this.map = new TMap.Map('mapContainer', {
center: new TMap.LatLng(31.23, 121.47),
zoom: 12,
});
// 添加标注
const marker = new TMap.Marker(new TMap.LatLng(31.23, 121.47));
this.map.addOverLay(marker);
},
// 地图缩放事件
onZoomChange: function (event) {
console.log('zoom changed:', event.detail);
},
// 地图拖动事件
onDragEnd: function (event) {
console.log('drag end:', event.detail);
},
})
```
需要注意的是,天地图API使用的是EPSG:4326坐标系,而微信小程序的默认坐标系是GCJ-02,需要进行坐标系转换才能在地图上正确显示。
阅读全文