0

マップを拡大または縮小するたびに、マーカーのサイズを変更しようとしています。現在、私はこのアプローチを使用しています：

  • zoomend メソッドですべてのマーカーを繰り返します。
  • 現在のアイコン サイズを取得する
  • 計算を実行して、ズーム サイズに従って新しいマーカー サイズを取得します。

  • 新しい寸法をアイコン オブジェクトに設定します。

    map.on('zoomend', function() {
zoomEndLevel = map.getZoom();
var difference = zoomEndLevel - zoomStartLevel;
console.log("difference in zoom " + difference);
markerArray.forEach(function(marker) {
    var icon = marker.options.icon;
    var oldX = icon.options.iconSize[0];
    var oldY = icon.options.iconSize[1];
    var newX = getNewIconAxis(oldX, difference);
    var newY = getNewIconAxis(oldY, difference);
    console.log(newX + " " + newY);
    icon.options.iconSize = [ newX, newY ];
    marker.setIcon(icon);
});

    });

    map.on('zoomstart', function() {
zoomStartLevel = map.getZoom();

    });

    function getNewIconAxis(value, zoomChange) {
if (zoomChange > 0) {
    for (var i = zoomChange; i > 0; i--) {
        value = value * 2;
    }
} else {
    for (var i = zoomChange; i < 0; i++) {
        value = value / 2;
    }
}
return value;

    }

問題 : このコードは、一度に 1 つのレベルをズームインおよびズームアウトすると正常に機能します。マウスを頻繁にスクロールインおよびスクロールアウトすると、このコードは奇妙な出力を出します。マーカーのサイズが大きすぎたり小さすぎたりすることがあります。

質問 : 1) 異なるズーム レベルでマーカーのサイズを変更できるようにする唯一の方法はこれですか? 2) はいの場合、ここで何が欠けているか、または完全に機能させるためにどのような変更を加える必要がありますか?

注：API固有の問題ではなく、マップ（Google、リーフレット、またはマップボックスのいずれか）の論理的な問題であるため、Googleマップにもタグを付けます。

4

1 に答える 1

0

あなたがあなたを導くいくつかの以前の投稿があるように見えます：

あなたのバグに関しては、イベントで現在のアイコン サイズを読み取る代わりにvalue、"zoomstart"以前のズーム値を覚えておいて、"zoomend"イベントでのみ読み取る方がよいかもしれません。"zoomstart"イベントが最後にのみ発生する可能性がありますが、連続してスクロールする（ズームイン/アウトする）ときにイベントが1回だけ発生するかどうかはわかりません"zoomend"。

于 2016-03-15T05:40:13.083 に答える