Usando dados aninhados com D3.js

Estou tentando exibir um belo gráfico de linhas usando D3. O problema que tenho é com o formato dos dados.

Tenho os seguintes dados (como exemplo):

var data = [
    {
      label: "name",
      data: [[14444123, 0.012321312],
             [14444123, 0.012321312],
             [14444123, 0.012321312], ...]
    },{
      label: "another name",
      data: [[14444123, 0.012321312],
             [14444123, 0.012321312],
             [14444123, 0.012321312], ...]
    }
];

Cada entrada contém o nome e um atributo de dados com matriz de pontos (cada ponto é representado como uma matriz, onde o item [0] é x carimbo de data e hora e o item [1] é o valor

Meu problema é que ele não está funcionando corretament

Este é o código D3 que tenho até agora:

var w = options.width,
    h = options.height,
    p = options.padding,
    x = d3.scale.linear()
        .domain([0, 1])
        .range([0, w]),
    y = d3.scale.linear()
        .domain([options.ydomainstart, options.ydomainend])
        .range([h, 0]);

var vis = d3.select(options.element)
    .data(data)
   .append("svg:svg")
    .attr("width", w + p * 2)
    .attr("height", h + p * 2)
   .append("svg:g");

vis.append("svg:line")
    .attr("stroke", '#808080')
    .attr("x1", p)
    .attr("x2", p)
    .attr("y1", 0)
    .attr("y2", h - p);

vis.append("svg:line")
    .attr("stroke", '#808080')
    .attr("x1", p)
    .attr("x2", w)
    .attr("y1", h - p)
    .attr("y2", h - p);

var rules = vis.selectAll("g.rule")
    .data(data)
   .enter()
   .append("svg:text")
    .attr("x", w - p)
    .attr("y", function(d, i) { return 15 + i*12; })
    .attr("text-anchor", "end")
    .attr("font-size", 12)
    .attr("fill", function(d, i) { return defaultColors[i % 5]; })
    .text(function(d) { return d.label;});

var lines = rules.data(function(d, i) {
        return d.data;
    })
   .append("svg:path")
    .attr("stroke", function(d, i) { return defaultColors[i % 5]; })
    .attr("d", d3.svg.line()
    .x(function(d) {
        return x(d[0]);
    })
    .y(function(d) {
        return y(d[1]);
    }));

O problema que tenho aparece nesta parte do código:

.x(function(d) {
    return x(d[0]);
})
.y(function(d) {
    return y(d[1]);
}));

Os dados dentro de 'd' NÃO são a matriz de pontos [x, y], mas cada valor dentro de cada matri

Significando, no primeiro item, d contém a coordenada x, no segundo item, tem a coordenada y, no terceiro item, contém a coordenada x no próximo ponto e assim por diant

É como se estivesse entrando recursivamente na matriz e, novamente, para cada valor intern

Eu não tenho ideia de como corrigir isso

questionAnswers(1)

yourAnswerToTheQuestion