单个标记上的setPosition触发所有标记的setContent

Question

在我正在研究的其中一个应用程序中，基于车辆的最后已知速度，我每隔100毫秒插入车辆的下一个位置并将其绘制在地图上。这导致移动设备出现性能问题。

我们还使用MarkerWithLabels在Marker旁边放置一个标签

在运行性能分析器时，我注意到MarkerWithLabels中的setContent执行了很多次并导致大型布局重绘。

设置console.log显示我们所有的标记都被调用了，即使我们只改变了其中一个标记的位置。

我在Codepen中重现了这个问题 - https://codepen.io/anon/pen/XZwGGr?editors=0011

相关代码的简短，

var i = 0.002;
setInterval(function() {
    dynamicMarker.setPosition(new google.maps.LatLng(-33.91627341958452 + i, 151.23648314155578 +i));
    i = i + 0.001;
    console.log('----------**----------');
}, 3000);

标记创建，

 var tempMarker = new MarkerWithLabel({
        map: map,
        animation: google.maps.Animation.DROP,
        position: positions[i],
        icon: markerIcon,
        labelContent: i.toString(),
        labelAnchor: new google.maps.Point(18, 12),
        labelClass: "my-custom-class-for-label", // the CSS class for the label
        labelInBackground: true
    });

我每隔3秒更新单个标记的位置。我还在HTML部分中修改了MarkerWithLabels的setContent函数。如果您打开控制台，则会看到setContent与内容一起打印。您会注意到，我们添加的所有标记都会发生这种情况，而不仅仅是要更新的标记。

这是常见的吗？这是它应该如何表现吗？

Answer 1

问题在于draw函数调用setContent并且看起来draw被连续调用。

不确定是否应该是这种情况，但是一个小的更新（将最后使用的内容存储在标记中，只有在更改后才更新）似乎可以解决问题（< em>没有任何直接问题）

请参阅https://codepen.io/anon/pen/jZogKN

Answer 2

你需要创建一个标记数组，因为它似乎是通过使用相同的var来保持它的引用（它发生在我身上）。

因此，您可以将标记推送到数组，并通过自定义ID或索引获取每个标记。