百度地图Api JavaScript API GL 自动根据起点终点创建两个信息弹窗
时间: 2024-03-21 18:38:49 浏览: 64
百度地图api
好的,根据您的需求,您可以使用百度地图API JavaScript API GL版本来实现根据起点和终点自动创建两个信息弹窗。以下是实现步骤:
1. 使用BMapGL.Map()创建地图实例,设置地图中心点和缩放级别。
2. 使用BMapGL.DrivingRoute()创建驾车路线实例,设置起点和终点位置。
3. 监听驾车路线实例的search()方法,当路线搜索完成后,获取路线方案,创建起点和终点的信息窗口。
以下是示例代码:
```javascript
// 创建地图实例
var map = new BMapGL.Map("mapContainer");
// 设置地图中心点和缩放级别
var point = new BMapGL.Point(116.404, 39.915);
map.centerAndZoom(point, 15);
// 创建驾车路线实例
var driving = new BMapGL.DrivingRoute(map, {
renderOptions: { map: map, panel: "routePanel" }
});
// 设置起点和终点位置
var start = new BMapGL.Point(116.301934, 39.977552);
var end = new BMapGL.Point(116.508328, 39.919141);
driving.search(start, end);
// 监听驾车路线实例的search()方法
driving.setSearchCompleteCallback(function (results) {
// 获取路线方案
var plan = results.getPlan(0);
// 创建起点信息窗口
var startInfoWindow = new BMapGL.InfoWindow("起点信息", { title: "起点" });
map.openInfoWindow(startInfoWindow, start);
// 创建终点信息窗口
var endInfoWindow = new BMapGL.InfoWindow("终点信息", { title: "终点" });
map.openInfoWindow(endInfoWindow, end);
});
```
在以上代码中,您需要将起点和终点位置的经纬度坐标替换为您自己的坐标,并在信息窗口中填写您想要显示的内容。
阅读全文