问题描述
我是D3.js的新手。我正在尝试在dimple.js lib中构建面积图，这是我的代码：
<!DOCTYPE html>
<Meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://dimplejs.org/dist/dimple.v2.0.0.min.js"></script>
<script src="https://d3js.org/d3-time.v2.min.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer",590,400);
d3.csv("Video_Game_Sales.csv",function (data) {
data = dimple.filterData(data,"Company",["Microsoft","Nintendo","Sony"])
var myChart = new dimple.chart(svg,data);
myChart.setBounds(70,30,340,330);
var x = myChart.addCategoryAxis("x",["Company","Year"]);
myChart.addPctAxis("y","Global Sales");
var s = myChart.addSeries("Genre",dimple.plot.area);
s.lineWeight = 1;
s.barGap = 0.05;
myChart.addLegend(430,20,100,300,"left");
myChart.draw();
});
</script>
</div>
</html>
在提示输出中：Error: <text> attribute x: Expected length,"Infinity".
因此，我提到Year列中的数据如下所示：1,996、1,997 ... 2,016等。因此，我决定使用以下代码行将数据转换为数据格式：
x.dateParseFormat="%Y";
但是我仍然有同样的问题。
解决方法
有两个问题，不是代码问题，而是csv文件本身：
- 在CSV距离计中：是
- 在数据值本身的分隔符中-有
,，我将其更改为.，所以它起作用了！！！ ：）
PS我没有更改Years字段数据类型。