Question

我仍然是d3和javascript的新手，所以我看到的大多数练习都与简单数组有关，但从不反对。现在，我正在尝试使用json文件中的数据创建一个组成一周数据的简单图表。首先，数据结构看起来有如下任意值：

{"2013-08-21":{"orders":"10","revenue":"1000"},
{"2013-08-22":{"orders":"20","revenue":"1800"},
{"2013-08-23":{"orders":"15","revenue":"1200"},
...}

我现在面临的问题是试图弄清楚如何有效地将日期传递到xScale域，以及yScale域中的订单或收入。如果它是CSV或TSV文件，我可以使用它：

xScale.domain(d3.extent(data, function(d) {return d.date;}));
yScale.domain(d3.extent(data, function(d) {return d.orders;}));

但是当我尝试用json对象做同样的事情时，它会告诉我以下内容：

Uncaught TypeError: #<Object> is not a function

有人可以帮助阐明这个问题吗？我可以尝试为日期，订单和收入创建列表数组，但还有其他方法吗？

谢谢你的时间！

修改的

当我在导入json文件后尝试映射数据时会发生TypeError：

d3.json("report.json", function(error, json) {
    if (error) return console.warn(error);
    dataset = json;
    dataset = dataset.map(function(d){
        var date = d3.keys(d)[0];
        d[date].date = date;
        return d[date];
    });
});

具体来说，就在这一行：

dataset = dataset.map(function(d){ ... }) 

Uncaught TypeError: Object #<Object> has no method 'map'

Answer 1

你基本上有两个选择： 1.将您的数据转换为更易于处理的格式 2.尝试处理您当前的格式。

我认为（1）在大多数情况下会让你的生活更轻松：

data = data.map(function(d) {
    // get the date
    var date = d3.keys(d)[0];
    // put it into the inner object
    d[date].date = date;
    // return the inner object
    return d[date];
});

这为您提供了

之类的行

{
  "orders": "10",
  "revenue": "1000",
  "date": "2013-08-21"
}

更易于处理。在你这样做的时候解析日期也可能是一个好主意。

过滤d3.js的JSON数据

1 个答案: