在 MAPBOX 中更改标记的旋转中心

Question

此代码将标记移动一个点（针对非洲），我需要更改为自定义位置。请有人帮助我。谢谢

var marker = new mapboxgl.Marker();

    function animateMarker(timestamp) {
        var radius = 20;

        // Update the data to a new position based on the animation timestamp. The
        // divisor in the expression `timestamp / 1000` controls the animation speed.
        marker.setLngLat([
            Math.cos(timestamp / 1000) * radius,
            Math.sin(timestamp / 1000) * radius
        ]);

        // Ensure it's added to the map. This is safe to call if it's already added.
        marker.addTo(map);

        // Request the next frame of the animation.
        requestAnimationFrame(animateMarker);
    }

    // Start the animation.
    requestAnimationFrame(animateMarker);

Answer 1

您需要修改 marker.setLngLat() 函数来偏移标记的经度和纬度以匹配您的首选位置。请参见 Mapbox documentation。

例如，下面的代码片段将为印度尼西亚雅加达周围的标记设置动画。

  marker.setLngLat([
    Math.cos(timestamp / 1000) * radius + 106.8,
    Math.sin(timestamp / 1000) * radius - 6.2
  ]);

完整的 CodePen here。

免责声明：我在 Mapbox 工作

在 MAPBOX 中更改标记的旋转中心

Change center of rotation of the marker in MAPBOX

javascript

mapbox-gl-js