D3 динамические имена ключей json


Когда вы хотите построить график в d3 и считываете входные данные из файла json (например), код выглядит примерно так:

 d3.json("data/data.json", function(error, data) {
    data.forEach(function(d) {
        d.date = parseDate(d.date);
        d.close = +d.close;
    });

    // Scale the range of the data
    x.domain(d3.extent(data, function(d) { return d.date; }));
    y.domain([0, d3.max(data, function(d) { return d.close; })]);

    svg.append("path")      // Add the valueline path.
        .attr("d", valueline(data));

    svg.append("g")         // Add the X Axis
        .attr("class", "x axis")
        .attr("transform", "translate(0," + height + ")")
        .call(xAxis);

    svg.append("g")         // Add the Y Axis
        .attr("class", "y axis")
        .call(yAxis);
});

В этом конкретном примере я получил от d3noob.org, существует JSON-файл с объектами, имеющими 2 ключа (дата и закрыть). Что делать, если я не знаю имена ключей файла json и мне нужно использовать строковую переменную? Например:

d3.json("data/data.json", function(error, data) {
        var var1 = "date";
        var var2 = "close";
        data.forEach(function(d) {
            d.var1 = parseDate(d.var1);
            d.var2 = +d.var2;
        });

Я пытался это сделать, но консоль выдает ошибку

D3.минута.js: 1 ошибка: атрибут d: ожидаемое число, "M0, NaNL106, NaNL212,...".

Что я здесь делаю не так?

2 2

2 ответа:

Используйте скобку [] для доступа к свойству объекта, имя которого хранится в переменной.

Например: d.var1 = parseDate(d.var1) становится d[var1] = parseDate(d[var1]).

Попробуйте это:

d3.json("data/data.json", function(error, data) {
    var var1 = "date";
    var var2 = "close";
    data.forEach(function(d) {
        d[var1] = parseDate(d[var1]);
        d[var2] = +d[var2];
    });