Я пытаюсь сделать линейную диаграмму в d3, со временем по оси x. Я использую данные json в переменной. Я использовал функцию d3.time.format() для форматирования времени, но это дает мне выше ошибки. Я изучаю d3, поэтому, пожалуйста, помогите. мой код:Uncaught TypeError: Не удается прочитать свойство 'length' undefined in d3
<div id="viz"></div>
<script>
var width = 640;
var height = 480;
var margin = {top: 30, right: 20, bottom: 30, left: 50},
width = 600 - margin.left - margin.right,
height = 270 - margin.top - margin.bottom;
var x = d3.time.scale().range([0, width]);
var y = d3.scale.linear().domain([height, 0]);
var xAxis = d3.svg.axis().scale(x).orient("bottom");
var yAxis = d3.svg.axis().scale(y).orient("left");
var data = [
{ "at": "2014-11-18T07:29:03.859Z", "value": 0.553292},
{ "at": "2014-11-18T07:28:53.859Z", "value": 0.563292},
{ "at": "2014-11-18T07:28:43.859Z", "value": 0.573292},
{ "at": "2014-11-18T07:28:33.859Z", "value": 0.583292},
{ "at": "2014-11-18T07:28:13.859Z", "value": 0.553292},
{ "at": "2014-11-18T07:28:03.859Z", "value": 0.563292}];
var line = d3.svg.line()
.x(function(d, i) { return x(d.x_axis); })
.y(function(d, i) { return y(d.y_axis); })
.interpolate("linear");
var vis = d3.select("#viz")
.append("svg:svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g").attr("transform","translate(" + margin.left + "," + margin.top + ")");
data.forEach(function(d) {
d.xAxis = d3.time.format("%d-%b-%y").parse(d.xAxis);
d.yAxis = +d.value;
});
x.domain(d3.extent(data, function(d) { return d.x_axis; }));
y.domain(d3.extent(data, function(d) { return d.y_axis; }));
vis.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
vis.append("g")
.attr("class", "y axis")
.call(yAxis);
vis.append("svg:path")
.datum(data)
.attr("class", "line")
.attr("d", line);
Спасибо, это полезно. – user1915636
Спасибо, это полезно. На самом деле я пытаюсь сделать линейную диаграмму, в которой входные данные являются потоком с сервера. Формат и значения данных такие же, как я использовал в данных var. Данные из потока постоянно обновляются каждые 10 секунд. Я хочу отображать данные последних 10 монет и хочу обновить график каждые 10 секунд. Мне нужен конечный результат, как в ссылке: http://bl.ocks.org/benjchristensen/2657838. Пожалуйста, предоставьте мне указатели, чтобы сделать диаграмму в d3. Спасибо в Advance – user1915636
Infact я попробовал один и тот же код, заменяя значение переменных данных потоком данных с сервера и запуская код на локальном хосте. Как-то на локальном хосте команда «data.forEach» (функция (d) { d.xAxis = iso.parse (d.at); d.yAxis = parseFloat (d.value); }); "задает ошибку как" Uncaught TypeError: Не удается прочитать свойство "forEach" неопределенного ". Пожалуйста, помогите. – user1915636