問題タブ [datamaps]

これは奇妙なものです。

標準の世界地図で次のことができ、変更ボタンをクリックすると機能します。

カスタムの topojson ファイルを使用すると、これを行うことができ、マップの読み込み時に変更が実装されます。

しかし、クリック イベント ハンドラーでラップしようとするとすぐに (世界地図の例とまったく同じように)、機能しません。

テスト アラートは正常にトリガーされますが、マップ クロロプレスは更新されません。

アイデアをありがとう！

私は D3 を使用して米国のマップを作成しています。国マップから州へ、州から郡へ、郡からジップ境界への 3 レベルのズームを実装する必要があります。

最初の 2 つのレベルは既に完了しており、AngularJS ディレクティブを使用しました。

GIST URL : D3 2 レベル ズーム

ここで、郡に入る第 3 レベルを実装し、すべてのジップ レベル エリアの境界を表示する必要があります。私はすでにzipレベルのジオメトリをたくさん検索しましたが、stackoverflowで1つの役立つ質問を見つけましたが、このデータには州名のみが関連付けられています。郡名も必要です。クリックされた特定の郡の境界を描くだけでよいため、手がかり適切な取得方法が役立ちます。US Atlas projectを見つけましたが、役立つことを願っていましたが、正しく理解できませんでした。

グローバル マップDataMaps.jsを使用します。マウス ホイールの移動時に、マウス ズームを実装したいと考えています。静的ズームの例があります。

また、イベント マウス ホイール があります。

これらのパーツを連結してみました。また、datamaps.jsを変更してみました。しかし、残念なことに、私は失敗します。

私はdatamaps docsに従っており、svgでレンダリングしているバブルにonClickリスナーを設定しようとしています。現在、svg divには次のサブタグがあります。

ドキュメントによると、マップにリストされている国について、これは次の方法で行う必要があります。

地図上の特定の地域をクリックしようとすると、これはうまく機能します。

同じリスナーを泡クラスにアタッチしようとしても何もしません..

そこで、HTML テンプレートで D3 データマップをレンダリングする Angular ディレクティブを作成しました。「data」属性を介してデータをディレクティブに渡します。私が直面している問題は、ページが初めて読み込まれたときにマップが完全に表示されることです。ただし、他のテンプレートからナビゲートしてテンプレートに戻ると (「ui-route」を介してルーティングが行われます)、マップはレンダリングされず、コンソールにもエラーはありません。これが私のディレクティブです：

テンプレートの角度コントローラーは次のとおりです。

HTML テンプレートは次のとおりです。

ページが最初にロードされたときのスクリーンショットを次に示します。

そして、ウェブサイトの他のテンプレートから移動した後、ページに戻った後の空のコンテナ。

何が起こっているのか分かりますか？

以下に示すように、div 要素の「maps-world」ID にデータマップ ワールド グラフを追加する必要があります。

以下は、私が追加する依存関係です（すべての依存関係はローカルに作成されます）

以下は、世界グラフを生成するために使用しているコードです。

コンソールに次のエラーが表示されます。 データマップが定義されていません

コロプレスという名前のdatamap-github-pageで与えられた例だったので、うまく動作するはずでした。これについて私を助けることができる体はありますか？