javascript - 多折线图 D3.js Json数据结构

Question

我正在尝试修改this fiddle

在哪里而不是这个 Json

var data = [{"symbol":"MSFT","date":"Day1","price":40},{"symbol":"MSFT","date":"Day2","price":23.18},{"symbol":"MSFT","date":"Day3","price":24.43}

我想传递这个Json格式的数据 { “第一天”:10， “第二天”:154， “第三天”:24， “第四天”:48， “第五天”:154， “第六天”:48， “第七天”:154， “第八天”:154， "lineName": "汽车", }。 { “第一天”:10， “第二天”:154， “第三天”:24， “第四天”:48， “第五天”:154， “第六天”:48， “第七天”:154， “第八天”:154， "lineName": "自行车", }, { “第一天”:10， “第二天”:154， “第三天”:24， “第四天”:48， “第五天”:154， “第六天”:48， “第七天”:154， “第八天”:154， "lineName": "飞机", }

我是 JS 和 D3.js 的新手，任何人都可以给我一些提示或示例，我可以修改代码以使其接受上述 Json 吗？或任何处理数据的方式

Answer 1

时间刻度不适合该域

• Use Ordinal scale

var domain = ["第 1 天","第 2 天","第 3 天","第 4 天","第 5 天","第 6 天","第 7 天"]; var xScale = d3.scale.ordinal() .domain(域名) .rangeRoundBands([0, 宽度], .1); var xAxis = d3.svg.axis() .scale(xScale) .tickSize(0) .orient("底部"); svg.append(“g”) .attr("类", "x 轴") .attr("变换", "翻译(0,"+ 高度 + ")") .call(xAxis);