2

リーフレット マップで整数ズーム レベルのみを使用するように強制することができません。-/+ コントロール ボタンのみを使用する限りは問題ありませんが、マウス ホイールまたは map.fitBounds(some polygon) のような関数を使用するとすぐに、ズーム レベルが分数になります。

私はレベル 0 から 17 のタイルを使用しており、10.5 のように 2 つのレベルの間の部分ズーム レベルになると、タイルが拡大縮小されてぼやけてしまうため、これは私にとっては悪いことです。

ドキュメントには、zoomSnap と zoomDelta のデフォルトは 1 であると書かれています。そのため、ズーム レベルが分数になってしまう理由がわかりません。どうすればこれを防ぐことができますか?

私はこれらを使用しています

<!-- Leaflet -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.1/dist/leaflet.js"></script>

<!-- L.esri for Leaflet -->
<script src="https://unpkg.com/esri-leaflet@2.0.4"></script>

<!-- Elevation plugin for Leaflet -->
<link rel="stylesheet" href="/app/libs/leaflet-elevation/dist/leaflet.elevation-0.0.4.css" />
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<!--<script src="app/libs/leaflet-elevation/dist/leaflet.elevation-0.0.4.min.js"></script>-->
<script src="/app/libs/leaflet-elevation/dist/leaflet.elevation-0.0.4.src.js"></script>

<!-- Marker Cluster plugin for Leaflet -->
<link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet.markercluster@1.0.0/dist/MarkerCluster.Default.css">
<link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet.markercluster@1.0.0/dist/MarkerCluster.css">
<script src="https://unpkg.com/leaflet.markercluster@1.0.0/dist/leaflet.markercluster.js"></script>

<!-- zoomhome plugin for Leaflet -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"/>
<link rel="stylesheet" href="/app/libs/leaflet-zoomhome/leaflet.zoomhome.css"/>
<script src="/app/libs/leaflet-zoomhome/leaflet.zoomhome.js"></script>

マップを初期化する方法は次のとおりです。

    this.map = L.map(this.config.domNode, {
        center: [50.13466432216696, -72.72949218750001],
        zoom: 6,
        zoomSnap: 1,
        zoomDelta: 1,
        zoomControl: false,
        minZoom: 3,
        maxZoom: 17,
        scrollWheelZoom: this.config.scrollWheelZoom,
        wheelDebounceTime: 20,
        wheelPxPerZoomLevel: 50
    });

    L.Control.zoomHome({ position: 'topright' }).addTo(this.map);
4

2 に答える 2

3

タングラム ライブラリは、ベースマップをマップに追加した後、zoomSnap を 0 に設定していました。基本的に、マップの部分ズーム レベルを有効にします。

タングラムのドキュメントを掘り下げた後、次の小さな情報を見つけました。

スクロールホイールの変更

デフォルトでは、Tangram は Leaflet のスクロール ホイールの動作を変更し、ズーム中の独自のレンダリング ループとの同期を改善します。これがアプリケーションに干渉する場合は、オプションの modifyScrollWheel オプションを使用してこの動作を無効にすることができます。

var layer = Tangram.leafletLayer({
    modifyScrollWheel: false,
    ...
});

私はそれを試しましたが、実際に私の問題を解決しました。

于 2016-11-02T20:03:30.177 に答える
0

分数ズームが拡張機能として追加され、 使用して無効にすることができますzoomStep= 1

于 2016-11-02T19:20:20.643 に答える