Googleマップには、マップ内の特定のポイントを強調するマーカーがあることを知っています. 何らかの理由で、このタイプのマップを自分のサイトに置くのが苦手で、jvector マップ効果が気に入っています。しかし、jVectorMap でマーカーを定義する方法を理解できません。jVectorMap でマーカーを定義し、それらのポイントを強調表示する方法についての手がかりはありますか。また、緯度と経度を使用して jVector Map の特定のポイントに到達する方法を知りたいです。
ありがとう。
Googleマップには、マップ内の特定のポイントを強調するマーカーがあることを知っています. 何らかの理由で、このタイプのマップを自分のサイトに置くのが苦手で、jvector マップ効果が気に入っています。しかし、jVectorMap でマーカーを定義する方法を理解できません。jVectorMap でマーカーを定義し、それらのポイントを強調表示する方法についての手がかりはありますか。また、緯度と経度を使用して jVector Map の特定のポイントに到達する方法を知りたいです。
ありがとう。
それができるようになりました。jVectorMap の新しいバージョン (0.2) では、markersパラメーターを使用してそのような機能が導入されています。ここでデモをチェックしてくださいhttp://jvectormap.com/examples/markers-world/。
jVectorMap の世界地図は、ファン デル グリンテン図法を使用しています。マップとの間で変換する式は、この ウィキペディアとWolframの記事にあります。
上記の式が経度/緯度 (-180 度から 180 度) を (-1 から +1) デカルト グリッドに投影すると、マップのサイズとオフセットに合わせてスケーリングする必要があります。
また、式の角度は度ではなくラジアンにする必要があります。
function vanDerGrinten(lat, lng) {
lat = lat * Math.PI / 180;
lng = lng * Math.PI / 180;
var lng0 = 0;
var A1 = 0.5 * Math.abs((Math.PI / (lng - lng0) - (lng - lng0) / Math.PI));
var phi = Math.asin(Math.abs(2 * lat / Math.PI));
var G = Math.cos(phi) / (Math.sin(phi) + Math.cos(phi) - 1);
P = G * (2 / Math.sin(phi) - 1);
Q = A1 * A1 + G;
x0 = A1 * A1 * (G - P * P) * (G - P * P) - (P * P + A1 * A1) * (G * G - P * P);
x1 = (A1 * (G - P * P) + Math.sqrt(x0));
x2 = (P * P + A1 * A1);
x = sgn(lng - lng0) * Math.PI * x1 / x2;
y = sgn(lat) * Math.PI * Math.abs(P * Q - A1 * Math.sqrt((A1 * A1 + 1) * (P * P + A1 * A1) - Q * Q)) / (P * P + A1 * A1);
return { _x: x, _y: y };
}
jvector マップはまさにベクター マップです。緯度/経度とベクトル空間の間に何らかのタイプの対応を作成する必要があります (例: 1px = 1deg)。これには、地図をカスタマイズするか、縮尺を確立するために地図を正確に測定する必要があります。言うまでもなく、メルカトル図法を使用していることを確認する必要があるため、平行線があなたが思っていることを意味するようになります ;)
編集: Google マップに問題がある場合は、リーフレットのような代替手段を使用することをお勧めします。jVector マップを拡張して、本来意図されていない 2 つのこと (ポイントのプロットと拡大縮小) を実行しようとしないでください。