Javascript d3js代码在联机编辑器中工作，但不在html文件中工作
这是我的d3.js代码Javascript d3js代码在联机编辑器中工作，但不在html文件中工作,javascript,canvas,charts,svg,d3.js,Javascript,Canvas,Charts,Svg,D3.js,这是我的d3.js代码 <html> <head> <title>D3 Test</title> </head> <body> <script type="text/javascript" src="d3/d3.v2.js"></script> <script type="text/javascript"> var w = 400,
<html>
<head>
<title>D3 Test</title>
</head>
<body>
<script type="text/javascript" src="d3/d3.v2.js"></script>
<script type="text/javascript">
var w = 400,
h = 400,
padding = 31,
p = 10,
barwidth = 10;
var data = [{count:200,year:2008},
{count:240,year:2010},
{count:290,year:2009}];
var bar_height = d3.scale.linear()
.domain([d3.max(data, function(d) { return d.count; }), 0] ) // min max of count
.range([p, h-p]);
var bar_xpos = d3.scale.linear()
.domain([2005, d3.max(data, function(d) { return d.year; })] ) // min max of year
.range([p,w-p]);
var xAxis = d3.svg.axis()
.scale(bar_xpos)
.orient("bottom")
.ticks(5); //Set rough # of ticks
var yAxis = d3.svg.axis()
.scale(bar_height)
.orient("left")
.ticks(5);
var svg = d3.select("svg")
.attr("width", w)
.attr("height", h);
svg.append("g")
.attr("class", "axis")
.attr("transform", "translate(0," + (h - padding) + ")")
.call(xAxis);
svg.append("g")
.attr("class", "axis")
.attr("transform", "translate(" + padding + ",0)")
.call(yAxis);
svg.selectAll("rect")
.data(data)
.enter().append("rect")
.attr("x", function(d) {
return bar_xpos(d.year); })
.attr("y", function(d) {
return bar_height(d.count); })
.attr("width", barwidth)
.attr("height", function(d) {return h - bar_height(d.count) - padding; })
.attr("fill", "steelblue")
</script>
</body>
D3试验
var w=400，
h=400，
填充=31，
p=10，
杆宽=10；
变量数据=[{计数：200，年份：2008}，
{计数：240，年份：2010}，
{计数：290，年份：2009}]；
var bar_height=d3.scale.linear（）
.domain（[d3.max（数据，函数（d）{return d.count；}），0]）//最小最大计数
.范围（[p，h-p]）；
var bar_xpos=d3.scale.linear（）
.domain（[2005，d3.max（数据，函数（d）{return d.year；}）]//年的最小最大值
.范围（[p，w-p]）；
var xAxis=d3.svg.axis（）
.比例尺（巴）
.orient（“底部”）
.蜱（5）//粗集
var yAxis=d3.svg.axis（）
.刻度（条形图高度）
.东方（“左”）
.蜱（5）；
var svg=d3.选择（“svg”）
.attr（“宽度”，w）
.attr（“高度”，h）；
svg.append（“g”）
.attr（“类”、“轴”）
.attr（“变换”、“平移（0）”+（h-填充）+”）
.呼叫（xAxis）；
svg.append（“g”）
.attr（“类”、“轴”）
.attr（“转换”、“转换”（+padding+”，0）”）
.呼叫（yAxis）；
svg.selectAll（“rect”）
.数据（数据）
.enter（）.append（“rect”）
.attr（“x”，函数（d）{
返回条（d.年）；}
.attr（“y”，函数（d）{
返回条高度（d.count）；}）
.attr（“宽度”，barwidth）
.attr（“height”，函数（d）{returnh-bar_height（d.count）-padding；}）
.attr（“填充”、“钢蓝”）
但是，当我在html文件中尝试此操作时，它不起作用。将svg附加到正文或div中
var svg = d3.select("body").append("svg")
.attr("width", w)
.attr("height", h);