2

最近、視覚化のために d3.js を試し始めました。私は JS や Web スクリプトのバックグラウンドをあまり持っていないので、簡単なことでしたら申し訳ありません。

正確な例はあまり重要ではありません。私はグラフを作っています、このようなもの

さまざまなデータ ソースを一覧表示するドロップダウン メニューをページに表示したいと考えています。ユーザーがデータ ソースを選択すると、グラフが更新されます。

こちらの例を使用してドロップダウン メニューを作成しました。ただし、行が必要なため、値を取得する方法がわかりません

d3.json("miserables.json", function(json) {

新しい名前で更新します。

4

1 に答える 1

7

html ファイルは次のようになります...

<select id="json_sources" name="json_sources">
    <option value ="source1.json" selected>Source 1</option>
    <option value ="source2.json">Source 2</option>
    <option value ="source3.json">Source 3</option>
</select>​

change次に、select 要素 ( .ond3.js 内) にイベントのイベント リスナーを追加します。

var dropdown = d3.select("#json_sources")
var change = function() {
  var source = dropdown.node().options[dropdown.node().selectedIndex].value;
  d3.json(source, function(json) {
     //continue doing stuff here.
  })
}

dropdown.on("change", change)
change(); //trigger json on load
于 2012-06-23T19:04:21.273 に答える