jquery - 画像としてのマーカー

Question

JVectorMapを使用して世界地図を作成しようとしていますが、デフォルトでは円ではなく画像（marker.png）としてマーカーを配置します。これはできますか？

Answer 1

画像ベースのマーカーの公式の例があります - http://jvectormap.com/examples/marker-icons/

Answer 2

画像マーカーが必要な場合は、新しいレイヤー (マップ内の svg レイヤー上の div) を使用し、各マーカーに新しい div を配置して、位置を設定します。

マップへの参照を取得する

map = $("#world-map-gdp").vectorMap('get', 'mapObject');

関数 map.latLngToPoint() を使用して、新しいレイヤーでポイントを見つけます。

var newMarkerP = map.latLngToPoint(lat,lng);
$('#marker1').css('top',newMarkerP.x);
$('#marker1').css('left',newMarkerP.y); 

ズームまたはドラッグを行う場合、同じ関数を使用して css left と css top を適用すると、マーカーを再配置できます。

新しいマーカーの上部と左側で遊ぶことができるかもしれませんが、簡単な解決策です。

Answer 3

まだ、この機能は次のリリースのいずれかで計画されています。