You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

ArcGIS地图图片标记增删方法及重复搜索标记不显示问题求助

解决ArcGIS GeoSearch定位标记不更新及标记增删问题

一、先修复你当前的标记不显示问题

看你的代码,有两个关键问题导致第二次点击后新标记无法显示:

  1. Graphic实例化错误
    你在添加标记时漏掉了new关键字,正确的Graphic创建方式应该是:

    polygraphlayer.add(new Graphic(pt1, markersymbol1));
    

    没有new的话,其实无法生成有效的Graphic对象,第一次能显示大概率是巧合,修正这个才能确保每次都能正确创建并添加标记。

  2. 坐标数据获取逻辑错误
    你判断dataLatt的写法有问题:$('#linkid')是一个jQuery对象,永远不会等于'undefined'或空字符串,应该直接判断data('latt')是否存在:

    var dataLatt = $('#linkid').data('latt') || '0,0';
    

    原来的写法会导致新搜索的坐标无法被正确获取,自然加不上新标记。

二、ArcGIS中添加与移除图片标记的方法

添加标记

除了修正上面的问题,你还可以优化逻辑让标记管理更清晰:

  • 确保polygraphlayer是全局可访问的图层实例(在函数外初始化)
  • 每次添加新标记前,可选择清空旧标记(实现“替换”而非“叠加”效果),示例:
// 全局初始化图层,只需执行一次
var polygraphlayer = new GraphicsLayer();
map.add(polygraphlayer); // 图层只需要添加到地图一次,不用每次调用addmarker都加

function addmarker(latt, longtt) {
  // 可选:清空旧标记,确保每次只显示最新的定位标记
  polygraphlayer.removeAll();
  
  var pt1 = new Point(Number(longtt), Number(latt));
  var markersymbol1 = new PictureMarkerSymbol('images/marker.png', 10, 15);
  polygraphlayer.add(new Graphic(pt1, markersymbol1));
}

移除标记

常见的移除方式有三种:

  • 移除所有标记:适合一次性清空图层内所有标记的场景,直接调用图层的removeAll()方法:
    polygraphlayer.removeAll();
    
  • 移除单个指定标记:如果需要精准移除某一个标记,添加时要保存该Graphic的引用,之后调用remove()方法:
    // 添加标记时保存引用
    var myMarker = new Graphic(pt1, markersymbol1);
    polygraphlayer.add(myMarker);
    
    // 移除时使用引用
    polygraphlayer.remove(myMarker);
    
  • 移除map.graphics中的标记:如果你是直接把标记添加到map.graphics而非自定义图层,逻辑类似:
    // 添加标记
    var myMarker = new Graphic(pt1, markersymbol1);
    map.graphics.add(myMarker);
    
    // 移除单个标记
    map.graphics.remove(myMarker);
    // 移除所有标记
    map.graphics.clear();
    

三、修正后的完整代码示例

// 全局初始化图层,仅执行一次
var polygraphlayer = new GraphicsLayer();
map.add(polygraphlayer);

function addmarker(latt, longtt) {
  // 清空旧标记,实现每次定位只显示最新标记
  polygraphlayer.removeAll();
  
  var pt1 = new Point(Number(longtt), Number(latt));
  var markersymbol1 = new PictureMarkerSymbol('images/marker.png', 10, 15);
  polygraphlayer.add(new Graphic(pt1, markersymbol1));
}

$("#linkid").on("click", function() {
  // 正确获取定位坐标数据
  var dataLatt = $('#linkid').data('latt') || '0,0';
  var splitdata = dataLatt.split(",");
  var latt = splitdata[0];
  var longt = splitdata[1];
  addmarker(latt, longt);
});

这样修改后,每次点击定位都会清空旧标记并添加新的标记,同时解决了之前的实例化和数据获取问题。

内容的提问来源于stack exchange,提问作者sumit kundan

火山引擎 最新活动