PS, КОТОРЫЕ ДОЛЖНЫ БЫТЬ НАПИСАНЫ ПЕРВЫМИ:
Вы проверили (!) Ресурсы, которые вы даете ссылку на эту скрипку ????? Он использует d3.v3.min.js, тогда как в вашем случае вы используете d3.v4. Ясно, что dimple 2.3.0 с d3.v4 не может обработать все нулевые случаи.
Я думаю, что нашел вашу проблему, я немного поэкспериментировал с вашим html, Я подозреваю, что вы также получаете такую же ошибку в jsfiddle, НО вы ее не видите . Странно, но в скрипте библиотека обрабатывает все 0, но не локально.
Если вы немного измените свои данные, например, минимальное значение и максимальное значение, отличное от 0, ваша библиотека сможет построить график.
Я подозреваю, что ваша библиотека пытается масштабировать данные, выполняя (value-min) / (max-min), и это дает вам 0/0, таким образом, NaN. Изменение предварительного смягчает это:
<code><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dimple/2.3.0/dimple.latest.min.js"></script>
</head>
<body>
<pre id="data">
Value,Year
1,2009
0,2010
0,2011
0,2012
0,2013
0,2014
0,2015
0,2014
0,2014
0,2012
0,2015
0,2010
0,2011
10,2013
var svg = dimple.newSvg ("# chartContainer", 600, 400);
var data = d3.csvParse (d3.select ("pre # data"). text ());
data.forEach (function (d, i) {d.Value = + d.Value; d.Year = + d.Year});
data.sort (function (a, b) {return a.Year - b.Year});
console.log (данные);
console.log (тип данных);
SetTimeout (функция (д, I) {
var chart = новая dimple.chart (svg, data);
var x = chart.addCategoryAxis ("x", "Year");
x.addOrderRule ( "Год");
var y = chart.addMeasureAxis ("y", "Value");
chart.addColorAxis («Значение», [«зеленый», «желтый», «красный»]);
var lines = chart.addSeries (null, dimple.plot.line);
lines.lineWeight = 4;
lines.lineMarkers = true;
chart.ease = "bounce";
//chart.staggerDraw = true;
chart.draw (2000);
}, 3000)