web-dev-qa-db-ja.com

d3.jsを使用してXMLデータをインポートする方法は?

誰かがd3を使用してXMLファイルからデータをインポートする方法の基本的な例を提供できますか?

私のXMLファイルは次のようになります。

    <data>
        <value>71</value>
        <value>12</value>
        <value>44</value>
        <value>88</value>
    </data>

これらの値をデータ配列に追加するにはどうすればよいですか?これが私がこれまでに試したことです:

    d3.xml("values.xml", function(xml) {
     d3.select(xml).selectAll("data").each(function(data) {
        d3.select(data).selectAll("value");
        //add data to array?;
        };
});
    //use Array
14
Olga

コールバックに渡されるXMLオブジェクトはXMLDOMのルート要素です( https://github.com/mbostock/d3/wiki/Requests#wiki-d3_xml を参照)。したがって、 JavaScript XML/DOMアクセス機能を使用して処理する必要があります。

D3.xmlを使用して棒グラフを作成する方法を示す小さな例を作成しました(元のd3棒グラフの例に基づく http://mbostock.github.com/d3/tutorial/bar-1.html ):

例を参照するためのリンク: http://bl.ocks.org/2772585

XMLコードとのリンク: https://Gist.github.com/lgrammel/2772585

20
Lars Grammel