D3 javascript/json不会运行

-1

我基本上只是试着运行这个教程脚本，但我必须不断地丢失一些东西，因为我只是不能让它执行。请借我你的眼睛，帮助我，非常感谢！D3 javascript/json不会运行

原教程： http://pothibo.com/2013/09/d3-js-how-to-handle-dynamic-json-data/

<!DOCTYPE html> 
 
<meta charset="utf-8"> 
 
<style> 
 

 
#demo{ 
 
\t height: 200px; 
 
\t background-color: blue; 
 
} 
 

 

 
</style> 
 
<script src="http://d3js.org/d3.v3.min.js"></script> 
 
<script> var JSONData = [ 
 
\t { "id": 3, "created_at": "Sun May 05 2013", "amount": 12000}, 
 
\t { "id": 1, "created_at": "Mon May 13 2013", "amount": 2000}, 
 
\t { "id": 2, "created_at": "Thu Jun 06 2013", "amount": 17000}, 
 
\t { "id": 4, "created_at": "Thu May 09 2013", "amount": 15000}, 
 
\t { "id": 5, "created_at": "Mon Jul 01 2013", "amount": 16000} 
 
\t ] 
 
</script> 
 

 
<head></head> 
 
<body> 
 

 
\t <div id="demo"></div> 
 

 
</body> 
 

 

 
<script> 
 

 
(function() { 
 
    var data = JSONData.slice(); 
 
    var format = d3.time.format("%a %b %d %Y"); 
 
    var amountFn = function(d) { return d.amount }; 
 
    var dateFn = function(d) { return format.parse(d.created_at) }; 
 

 
    var x = d3.time.scale() 
 
    .range([10, 280]) 
 
    .domain(d3.extent(data, dateFn)); 
 

 
    var y = d3.scale.linear() 
 
    .range([180, 10]) 
 
    .domain(d3.extent(data, amountFn)); 
 
    
 
    var svg = d3.select("#demo").append("svg:svg") 
 
    .attr("width", 300) 
 
    .attr("height", 200); 
 

 
    svg.selectAll("circle").data(data).enter() 
 
    .append("svg:circle") 
 
    .attr("fill", white) 
 
    .attr("r", 4) 
 
    .attr("cx", function(d) { return x(dateFn(d)) }) 
 
    .attr("cy", function(d) { return y(amountFn(d)) }); 
 
})(); 
 

 
</script>

来源

2014-12-05 onkeldittmeyer

把'script' T的定义后他'div'。目前，它在'div'存在之前运行，因此不会添加任何内容。 – 2014-12-05 12:17:40

谢谢！修正了订单，但不幸的是没有修复脚本本身 – onkeldittmeyer 2014-12-05 12:53:05

请勿发布生成控制台错误的代码。你知道如何看待控制台吗？如果没有，请停止你正在做的一切，并学习如何。这个引擎比发现你的代码的一群SO人更容易（也更快）发现错误。 – 2014-12-05 16:14:20

-1

错字

svg.selectAll("circle").data(data).enter() 
    .append("svg:circle") 
    .attr("fill", white) 
       ^^^^^ 
    .attr("r", 4) 
    .attr("cx", function(d) { return x(dateFn(d)) }) 
    .attr("cy", function(d) { return y(amountFn(d)) });

应该是字符串"white"

来源

2014-12-05 12:54:09 Leo

不要鼓励使用SO作为众包的错字发现服务的海报，甚至不知道如何查看控制台。 – 2014-12-05 16:15:09

D3 javascript/json不会运行

回答

相关问题