Question

我正在使用amcharts4作为流星项目的一部分。目的是显示地图并在地图上显示地图标记。每次数据更改时，地图标记都必须更新并指向新位置。

我试图重用已经available demo的

我添加的唯一一点是将不同的数据集重新分配给imageSeries，以使其更新地图上的标记。

我有一个jsfiddle来演示正在发生的事情。 setTimeout函数用于模拟5秒钟后的数据更改。

  setTimeout(function(){
        $('.map-marker').remove()
        imageSeries.data = [{
           "zoomLevel": 5,
           "scale": 0.5,
           "title": "Brussels",
           "latitude": 50.8371,
           "longitude": 4.3676
         }];
        imageSeries.validateData();
    }, 5000)

5秒后确实发生数据更改。但是，除非您手动平移地图或放大/缩小地图，否则新点不会显示在地图上。

如何解决此问题？

Answer 1

重绘/更新后，

AmCharts 会更新地图。问题是您使用的是自定义HTML标记，而不是仅使用this demo中的图像的本机功能。由于您使用的是自定义设置，因此需要执行额外的步骤（顺便说一句，这是为v3编写的演示的端口，该示例也没有本地HTML标记）。

在演示中，updateCustomMarkers首先负责将标记放置在地图上。请注意，该演示程序通过将此方法附加到地图实例的mappositionchanged事件来设置自定义标记，由于创建时发生的缩放/视口定位，该事件也恰好在地图初始化期间被调用。这也是为什么您仅在手动放大后才看到标记的原因。数据更新超时不会调用updateCustomMarkers，因此除非您随后手动调用该方法，否则不会绘制自定义标记。请注意，替换整个数组时也不需要调用invalidateData。

setTimeout(function() {
  $('.map-marker').remove()
  imageSeries.data = [{
    "zoomLevel": 5,
    "scale": 0.5,
    "title": "Brussels",
    "latitude": 50.8371,
    "longitude": 4.3676
  }];
  updateCustomMarkers();
}, 5000)

请注意，使用本机图像时不需要执行此额外步骤，因为地图会自动更新该情况下的标记。

amCharts4数据更改不会触发地图重绘

1 个答案: