首页 > 解决方案 > 错误:属性高度:预期长度,“NaN”

问题描述

我正在尝试使用从 WHO 网站下载的数据将条形图制作成 Excel 文档。我的 .csv 就是这样(尝试了带和不带“s)

"WHO_region","percentage"
"Africa",52.2
"Americas",83
"South-East Asia",75.1
"Europe",75.1
"Eastern Mediterranean",63.6
"Western Pacific",89.7

我正在尝试使用百分比列来确定我的条形图的高度,我已经将“百分比”拉出来作为它自己的变量,而我正在使用它,因为它更干净一点?没有任何工作 - 不是 parseFloat、parseInt 等?为什么会这样?完整代码如下:

<script type="text/javascript">

    //declare global variables 
    var w = 600, h = 200, padding = 30, margin = 30;

    //import the .csv data
    d3.csv("WHO_familyplanningdata.csv", function(data) {
            console.log(data)});

    //create the SVG
    var svg = d3.select("body")
            .append("svg")
            .attr("width", w)
            .attr("height", h);

    //import the .csv data
    d3.csv("WHO_familyplanningdata.csv", function(data) {
            console.log(data); 

    //clean up data
    var percent = parseInt(data.percentage)

    //create rects, and add them to the SVG 
    svg.selectAll("rect")
            .data(data)
            .enter()
            .append("rect")
            .attr("x", function(d,i) {
                    return i * (w / data.length);
            }) //distributes them across the x axis 
            .attr("y", 0)
            .attr("width", (w / data.length) /2)
            .attr("height", function(d, i) { 
                    return percent;
            });

 }); //end of the data wrapping 
   </script>

非常感谢任何帮助 - 谢谢!:)

标签: csvd3.jsnan

解决方案


推荐阅读