d3.select 方法不起作用 [英] d3.select method not working
问题描述
我是 datavis 和 D3 库的新手，我正在尝试遵循这里的 tut http://mbostock.github.com/d3/tutorial/bar-1.html
I am new to datavis and the D3 library and I'm trying to follow the tut here http://mbostock.github.com/d3/tutorial/bar-1.html
当我运行代码时，我的网页上没有显示任何内容，有人能指出问题吗??
When I run the code, nothing displays on my webpage, can anyone point out the problem??
我认为这与 d3.select 方法有关.当我运行代码并检查它时，主体是空的，所以我假设没有创建任何东西.任何帮助将不胜感激！！！
I think its something to do with the d3.select method. When I run the code and inspect it, the body is empty, so Im assuming nothing is being created. Any help would be hugely appreciated!!!
<title>3Dtut - 1</title>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?2.4.5"> </script>
<script type="text/javascript">
var data = [4, 8, 15, 16, 23, 42];
//container for the bar chart
var chart = d3.select("body").append("div")
.attr("class", "chart");
//adding div elements to the bar chart
chart.selectAll("div")
.data(data)
.enter().append("div")
.style("width", function(d) { return d * 10 + "px"; })
.text(function(d) { return d; });
</script>
<STYLE type="text/css">
.chart div {
font: 10px sans-serif;
background-color: steelblue;
text-align: right;
padding: 3px;
margin: 1px;
color: white;
}
</STYLE>
</head>
<body>
</body>
</html>
推荐答案
问题与你的 在 html 文档中.
The problem is related to the position of your <script> .. </script> within the html document.
在执行您的脚本时，尚不存在 body 元素.这意味着 d3.select("body") 将为空，并且没有附加 div.chart.
No body element exists yet at the moment that your script is being executed. That means that d3.select("body") will be empty, and no div.chart is being appended.
尝试移动您的
