AAA努力才幸福 发表于 2023-3-5 13:14:14

百度地图批量标记点怎么写JS

本帖最后由 AAA努力才幸福 于 2023-3-6 09:28 编辑

如题，批量把数据表中的经纬度标记到地图上

AAA努力才幸福 发表于 2023-3-6 09:29:02

var p = Forguncy.Page; // 获取当前页面
var element = $("");
var map = new BMap.Map(element); // 创建Map实例
map.centerAndZoom(new BMap.Point(113.636878,34.757711), 8); // 初始化地图,设置中心点坐标和地图级别

// 添加地图类型控件
map.addControl(new BMap.MapTypeControl({
mapTypes: [
    BMAP_NORMAL_MAP,
    BMAP_HYBRID_MAP
]
}));
map.setCurrentCity("郑州"); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true);

// 读取A1单元格中的JSON数据
var data = JSON.parse(Forguncy.Page.getCell("gps").getValue());

// 批量标记坐标点
data.forEach(function(point) {
var coords = point.gps.split(";");
var pointLatLng = new BMap.Point(coords, coords);

// 创建标记点
var marker = new BMap.Marker(pointLatLng);
map.addOverlay(marker);

// 点击标记点弹出信息框
var infoWindow = new BMap.InfoWindow();
marker.addEventListener("click", function() {
    // 构建信息框内容
    var content = "";
    if (point.file_id) {
      content += "<div>附件：<a href='/file/" + point.file_id + "' target='_blank'>" + point.file_name + "</a></div>";
    }
    if (point.image_url) {
      content += "<div>图片：<img src='" + point.image_url + "'></div>";
    }
    if (point.物料名称) {
      content += "<div>物料名称：" + point.物料名称 + "</div>";
    }
    if (point.项目名称) {
      content += "<div>项目名称：" + point.项目名称 + "</div>";
    }
if (point.收货人) {
      content += "<div>收货人：" + point.收货人 + "</div>";
    }
    infoWindow.setContent(content);

   // 显示信息框
    map.openInfoWindow(infoWindow, pointLatLng);
});
});
注意json数据格式，其他设置参考官方百度组件在设置内添加接口

Joe.xu 发表于 2023-3-6 09:00:21

您好，代码方面我们也不太擅长，不过我可以帮你在我们的项目需求及大群宣传一下，
那边有很多大神，说不定几天就搞好了，不过这种事一般是有偿的，需要的话，留下您的电话号码

AAA努力才幸福 发表于 2023-3-6 09:26:22

已经解决了，以下代码可以实现，
注意json数据格式及字段
var p = Forguncy.Page; // 获取当前页面
var element = $("");
var map = new BMap.Map(element); // 创建Map实例
map.centerAndZoom(new BMap.Point(113.636878,34.757711), 8); // 初始化地图,设置中心点坐标和地图级别

// 添加地图类型控件
map.addControl(new BMap.MapTypeControl({
mapTypes: [
    BMAP_NORMAL_MAP,
    BMAP_HYBRID_MAP
]
}));
map.setCurrentCity("郑州"); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true);

// 读取A1单元格中的JSON数据
var data = JSON.parse(Forguncy.Page.getCell("gps").getValue());

// 批量标记坐标点
data.forEach(function(point) {
var coords = point.gps.split(";");
var pointLatLng = new BMap.Point(coords, coords);

// 创建标记点
var marker = new BMap.Marker(pointLatLng);
map.addOverlay(marker);

// 点击标记点弹出信息框
var infoWindow = new BMap.InfoWindow();
marker.addEventListener("click", function() {
    // 构建信息框内容
    var content = "";
    if (point.file_id) {
      content += "<div>附件：<a href='/file/" + point.file_id + "' target='_blank'>" + point.file_name + "</a></div>";
    }
    if (point.image_url) {
      content += "<div>图片：<img src='" + point.image_url + "'></div>";
    }
    if (point.物料名称) {
      content += "<div>物料名称：" + point.物料名称 + "</div>";
    }
    if (point.项目名称) {
      content += "<div>项目名称：" + point.项目名称 + "</div>";
    }
if (point.收货人) {
      content += "<div>收货人：" + point.收货人 + "</div>";
    }
    infoWindow.setContent(content);

   // 显示信息框
    map.openInfoWindow(infoWindow, pointLatLng);
});
});

Joe.xu 发表于 2023-3-6 10:00:04

:hjyzw::jy74a:

ToPMonsTeR 发表于 2024-6-16 15:02:13

你找到解决办法了吗?

AAA努力才幸福 发表于 2024-6-16 15:13:29

ToPMonsTeR 发表于 2024-6-16 15:02
你找到解决办法了吗?

js写，看我上面的代码就可以实现。

ToPMonsTeR 发表于 2024-6-16 15:19:17

AAA努力才幸福 发表于 2024-6-16 15:13
js写，看我上面的代码就可以实现。

读取A1单元格的Jason数据这个我有点不太理解

ToPMonsTeR 发表于 2024-6-16 15:30:25

按照代码复制进出运行后没有反应.

AAA努力才幸福 发表于 2024-6-16 16:01:21

ToPMonsTeR 发表于 2024-6-16 15:19
读取A1单元格的Jason数据这个我有点不太理解

把数据库的每一组经纬度。合成一个数组
页: [1] 2
查看完整版本: 百度地图批量标记点怎么写JS