境界を計算する方法

私はリアクションリーフレットを使用しようとしていますが、boundsOptionsを動作させることはできません。これは明らかに境界を事前計算する場合にのみ機能するためです。境界を計算する方法

特定のポイントとズームレベルまたは半径を指定して境界を計算するにはどうすればよいですか？ cheap-ruler、すなわちを使用して

const position = [40.706213526877455, -74.0044641494751]; 
const zoom = 13; 

return (<Map ref="leaflet" center={ position } boundsOptions={ { paddingBottomRight: [100, 100] } zoom={ zoom } } />)

出典

2017-02-23 Andy

あなたはマップのレンダリングの前または後に境界を計算しようとしていますか？コンポーネントのReact-Leafletのコードは、 'bounds'プロパティを送信しない限り、マップを境界に収めることができません。 –

@EvanSiroky以下の私のソリューションは、レンダリングの前にそれを計算します。これは、望ましくないアニメーションを避けるため最適です。 – Andy

計算範囲：

getBounds(center) { 
    const ruler = cheapRuler(center[0], 'meters'); 
    const bbox = ruler.bufferPoint(center, 100000); 
    const p1 = Leaflet.latLng(bbox[0], bbox[1]); 
    const p2 = Leaflet.latLng(bbox[2], bbox[3]); 

    return Leaflet.latLngBounds(p1, p2); 
}

出典

2017-02-23 16:42:23 Andy

あなたは（のgetBoundsを使用することができます）

this.refs.leaflet.leafletElement.getBounds()

出典

2017-02-23 16:44:31

私はそれを試みましたが、マップ全体がレンダリングされた後、 'ref'からリーフレットへの参照しか取得できません。このアプローチには、最初のパスでの不要なアニメーションなどの副作用があります。私はおそらくそれを回避することができます。 – Andy

答えて

関連する問題