如何从 Ammap.js 中删除 MapImage

Question

我一直在使用 Ammap 库并创建了地图。
https://www.amcharts.com/demos/custom-html-elements-map-markers/

我想使用 method() 删除 Map images 对象，详情如下 link。 谁能告诉我如何使用这个方法()

https://docs.amcharts.com/3/javascriptmaps/MapImage#deleteObject
方法名称："deleteObject()"

提前致谢

Answer 1

deleteObject是image/object本身的成员方法，所以你只需要从你要删除的对象中调用它，例如

image.deleteObject();

如果您的地图像演示中那样使用自定义 HTML 元素，您还需要通过调用 removeChild 删除在 createCustomMarker 方法中生成的 div DOM。您需要能够以某种方式访问​​ div，因此我建议修改它以将 div 的 id 设置为您稍后可以查找的内容，例如图像的 id:

// this function creates and returns a new marker element
function createCustomMarker(image) {
  // create holder
  var holder = document.createElement("div");
  holder.className = "map-marker";
  holder.title = image.title;
  holder.id = image.id; //added to make div lookup easier
  // ...
}

此修改假设您在图像中设置了一个id，这也是推荐的，因为您可以使用getObjectById方法获取图像对象并调用其deleteObject方法。

这是一个在提供图像 ID 时同时删除图像和自定义标记的示例函数：

function deleteImage(imageId) {
  var image = map.getObjectById(imageId);
  var imageDiv;
  if (image) {
    image.deleteObject(); //delete the ammap image object
    imageDiv = document.getElementById(imageId); //get the custom marker div
    imageDiv.parentNode.removeChild(imageDiv); //remove it from the DOM
  }
}

Demo - 点击按钮删除相应的标记。