-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>
把'script' T的定义后他'div'。目前,它在'div'存在之前运行,因此不会添加任何内容。 – 2014-12-05 12:17:40
谢谢!修正了订单,但不幸的是没有修复脚本本身 – onkeldittmeyer 2014-12-05 12:53:05
请勿发布生成控制台错误的代码。你知道如何看待控制台吗?如果没有,请停止你正在做的一切,并学习如何。这个引擎比发现你的代码的一群SO人更容易(也更快)发现错误。 – 2014-12-05 16:14:20