2016-08-08 6 views
1

リーフレット1.0.0-rc.2 + e02b5c9を使用しています。180度子午線の近くにリーフレットマーカーを表示するには?

Default rendering image

は、しかし、私はこれを表示するこの経度などの地図を表示したい:私は、デフォルトでは、ここでのスクリーンショットのように180に経度-180からすべてのマーカー、ポリライン...をレンダリングしている知っていますポイント(これは、日本と米国の間の中間の海です):

I want to show at this point

ができますが、すべてのマーカーが右側に表示されません参照してください。にもかかわらず、場合、私は私が右にドラッグすると、すべてのマーカーが右側に現れているが、彼らはその逆の左側に消失している

worldCopyJump: true 

を設定します。実際に、私は彼らが同時に登場したい。

これを修正するアイデアは何ですか?

+0

ありがとうございました@ghybs –

答えて

1

未満であれば、あなたのマーカーの経度を高めることであるLeaflet Github

に報告されていますのマーカーの範囲は、-180..180ではなく0..360です。 See a working example

つまり、経度がゼロより小さい場合は、360を追加します。すべての経度を一度にフィルタリングする場合は、代わりにL.Util.wrapNum(lng, [0,360], true)を使用します。

+0

リンクはもう有効ではありません – Icarus

1

同様の問題が発生し、解決策は彼らの初期の経度は念経度ことを確認0

var totalMarkers = markerPositions.length; 
for(var i = 0; i<totalMarkers; i++){ 
    var mData = markerPositions[i]; 
    if (mData.lon < 0) { 
     mData.lon += 360; 
    } 
    L.marker([mData.lat, mData.lon]).addTo(map); 
} 
0

ありがとうございました。実際には、私はあなたの提案されたコードを使用していないが、私はそれを修正するためのアイデアを得た。

これが私の解決策では、同じソリューションを探して他の人のために、それが参考に願っています: Screenshot that was solved

常にあなたがしたい経度の範囲にマップ(上のアイコンとそのコピーを表示し、私の場合、それは0からです

makeMarker: -> 
    LeafletIcon = L.Icon.extend(
    options: { 
     iconSize:  [25, 25], 
     iconAnchor: [10, 10], 
     popupAnchor: [0, 0] 
    }, 
) 
    icon = new LeafletIcon({iconUrl: this.iconUrl}) 

    marker = L.marker([this.latitude, this.longitude], {icon: icon, zIndexOffset: 10}) 
    marker.id = this.id 

    marker 

はAGAありがとう:項目クラスで)360へ

makeMarkers: (item) -> 
    markers = [] 
    markers.push(item.makeMarker()) 

    copy_marker = item.makeMarker() 
    copy_marker.setLatLng(new L.LatLng(copy_marker._latlng.lat, copy_marker._latlng.lng + 360)) 
    markers.push(copy_marker) 

    markers 

に。

関連する問題