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

Question

在我正在处理的一个应用程序中，根据车辆的最后已知速度，我每 100 毫秒插值一次车辆的下一个位置并将其绘制在地图上。这会导致移动设备出现性能问题。

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

虽然运行性能分析器，但我注意到 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

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

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

Answer 2

问题出在draw函数调用了setContent，貌似一直在调用draw。

不太确定是否应该是这种情况，但是一个小的更新（将最后使用的内容存储在标记中并且只在它发生变化时更新它）似乎解决问题（没有任何直接问题）

见https://codepen.io/anon/pen/jZogKN

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

setPosition on a single marker triggers setContent for all markers

javascript

google-maps

google-maps-markers