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不會運行

回答

相關問題