指定されたペアの x と y のピクセル座標に基づいて世界地図から国を取得できる世界地図の視覚化を作成しています。
現時点では、データマップ ( http://datamaps.github.io/ ) を使用しています。しかし、指定された x または y ピクセル座標のペアに基づいて、特定の国名または ID を取得する方法が見つかりません。誰かが私を正しい方向に導くことができますか?
前もって感謝します。
指定されたペアの x と y のピクセル座標に基づいて世界地図から国を取得できる世界地図の視覚化を作成しています。
現時点では、データマップ ( http://datamaps.github.io/ ) を使用しています。しかし、指定された x または y ピクセル座標のペアに基づいて、特定の国名または ID を取得する方法が見つかりません。誰かが私を正しい方向に導くことができますか?
前もって感謝します。
マークアップをよく見ると、各ポリゴンの CSS クラスに 3 文字の国コードが追加されていることがわかります。
class="datamaps-subunit JPN"
したがって、必要なのは、関心のあるポイントでポリゴンを見つけることです。この回答Hit-testing SVG shape? それを達成するのに役立つかもしれません。次のようなことを示唆しています。
svg.getIntersectionList(hitrect, null);
また
document.elementFromPoint(x, y);
それを取得したら、クラス名を抽出するのは比較的簡単です。
var code = d3.select(element).class().replace("datamaps-subunit ", "");