如何使用d3.js导入XML数据?

时间:2012-05-21 09:41:15

标签: xml d3.js

有人可以提供一个基本的例子,说明如何使用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

1 个答案:

答案 0 :(得分:20)

传递给回调的XML对象是XML DOM的根元素(请参阅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