Javascript 错误：值为<&引用；rect">；=&引用；南",；，错误：值为<&引用；“文本”>；=&引用；“南”；_Javascript_D3.js

Javascript 错误：值为<&引用；rect">；=&引用；南",；，错误：值为<&引用；“文本”>；=&引用；“南”；

javascript d3.js

Javascript 错误：值为<&引用；rect">；=&引用；南",；，错误：值为<&引用；“文本”>；=&引用；“南”；,javascript,d3.js,Javascript,D3.js,因此，我将继续学习D3JS教程，我在过去曾使用过javascript，但我真的很想拓宽我的视野，学习如何制作这些非常棒的数据驱动网站。此外，我目前正在一个地方工作，将在未来需要的DDD模型，我希望是最快的速度，当这发生。然而，在学习本教程的过程中，我遇到了一个疯狂的错误 Error: value of <"rect"> = "NaN", Error:Value of <"text"> = "Nan" 确保TSV中的值用制表符分隔，而不是空格。尝试将数据打印到控制台以查

因此，我将继续学习D3JS教程，我在过去曾使用过javascript，但我真的很想拓宽我的视野，学习如何制作这些非常棒的数据驱动网站。此外，我目前正在一个地方工作，将在未来需要的DDD模型，我希望是最快的速度，当这发生。然而，在学习本教程的过程中，我遇到了一个疯狂的错误

Error: value of <"rect"> = "NaN", Error:Value of <"text"> = "Nan"

确保TSV中的值用制表符分隔，而不是空格。

尝试将数据打印到控制台以查看是否返回了任何内容。请显示data.TSV中的示例。@sliperypet问题已用data.TSV文件更新。很抱歉给您带来不便，hanks@RichardDavy，我不知道这是否是在网站上发布的工件，但我不得不将TSV分隔符编辑为选项卡而不是空格。然后你的代码工作了。请参阅下面的答案。@slipperypet好的，我必须问你是用什么程序编辑tsv文件的，我使用的是notepad++并且我在选项卡上得到了相同的结果，如果为了简单起见我切换到csv呢

<!DOCTYPE html>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Stacked Bar Graph</title>
 <script src="http://d3js.org/d3.v3.min.js"></script>

<div class="chart">
<script>        
    d3.tsv("data.tsv", type, function(data) {           
        var width = 420, 
            barHeight = 20;         
        var x = d3.scale.linear()
            .range([ 0, width ])
            .domain([ 0, d3.max(data, function(d) {
            return d.value;
        }) ]);
        var chart = d3.select(".chart")
            .append("svg")
            .attr("width", width)
            .attr("height", barHeight * data.length);
        var bar = chart.selectAll("g")
            .data(data)
            .enter()
            .append("g")
                .attr("transform", function(d, i) {
                    return "translate(0," + i * barHeight + ")";
                });
        bar.append("rect").attr("width", function(d) {
            return x(d.value);
        }).attr("height", barHeight - 1).attr("fill", "steelblue");

        bar.append("text").attr("x", function(d) {
            return x(d.value) - 3;
        }).attr("y", barHeight / 2).attr("dy", ".35em").attr("fill",
                "white").attr("font", "10px san-serif").attr("text-anchor",
                "end").text(function(d) {
            return d.value;
        });
    });     
    function type(d) {
        d.value = +d.value;
        return d;
    }
</script>
</div>

name    value
Locke   4
Reyes   8
Ford    15
Jarrah  16
Shepard 23
Kwon    42