Dessiner le graphique de ligne simple D3 avec une matrice

Je tente d'implémenter ce code: http://bl.ocks.org/3883245 , mais au lieu de charger un fichier TSV, je charge les données d'un tableau. Voici comment appartient le tableau:

[["2012-10-02",2],["2012-10-09", 2], ["2012-10-12", 2]] 

Ensuite, j'ai appliqué cette fonction pour obtenir le format CSV: var data = d3.csv.format(BigWordsDates2[ArrayIndex]);

Mais encore rien ne se présente.

Voici le code entier: je pense que je ne suis pas loin de l'avoir, mais j'ai travaillé pendant 3 jours et je ne peux toujours pas le faire fonctionner:

 var margin = {top: 20, right: 20, bottom: 30, left: 50}, width = 80 - margin.left - margin.right, height = 80 - margin.top - margin.bottom; var data = d3.csv.format(BigWordsDates2[ArrayIndex]); var parseDate = d3.time.format("%Y-%b-%d").parse; var x = d3.time.scale() .range([0, width]); var y = d3.scale.linear() .range([height, 0]); var xAxis = d3.svg.axis() .scale(x) .orient("bottom"); var yAxis = d3.svg.axis() .scale(y) .orient("left"); var line = d3.svg.line() .x(function(d) { return x(d.date); }) .y(function(d) { return y(d.close); }); var svg = d3.select("#Graph").append("svg") .attr("width", width + margin.left + margin.right) .attr("height", height + margin.top + margin.bottom) .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); d3.csv.parseRows(data, function(data) { data.forEach(function(d) { d.date = parseDate(d.date); d.close = parseInt(d.close); }); x.domain(d3.extent(data, function(d) { return d.date; })); y.domain(d3.extent(data, function(d) { return d.close; })); svg.append("g") .attr("class", "x axis") .attr("transform", "translate(0," + height + ")") .call(xAxis); svg.append("g") .attr("class", "y axis") .call(yAxis) .append("text") .attr("transform", "rotate(-90)") .attr("y", 6) .attr("dy", ".71em") .style("text-anchor", "end") .text("Price ($)"); svg.append("path") .datum(data) .attr("class", "line") .attr("d", line); });` 

Je pense que je fais également quelque chose de mal avec le d.date et le d.close, mais je ne peux pas le comprendre non plus.

Le graphique utilise les données dans le format suivant

 [{ date: '...', close: '...'}, { date: '...', close: '...'}] 

Donc, vous devez analyser votre tableau:

 // fix your data parser var parseDate = d3.time.format("%Y-%m-%d").parse; var arrData = [ ["2012-10-02",200], ["2012-10-09", 300], ["2012-10-12", 150]]; // create a new array that follows the format var data = arrData.map(function(d) { return { date: parseDate(d[0]), close: d[1] }; }); 

Voici la version de travail: http://jsfiddle.net/jaimem/T546B/

Pd: en fonction des données que vous pourriez avoir pour modifier le domaine de votre échelle.