在d3js中创建基本条形图 [英] Creating a basic bar chart in d3js
本文介绍了在d3js中创建基本条形图的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我按照此教程在D3js中创建了一个简单的条形图， t查看任何图表！
I followed this tutorial to create a simple bar chart in D3js, but I don't see any chart!
HTML：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="utf-8">
<title>Learning Javascript!</title>
<link rel="stylesheet" href="main.css">
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<h1>Learning Javascript and HTML/CSS!</h1>
<p class="special">This is the first parapgraph.</p>
<div class="chart">
</div>
</body>
</html>
Javascript：
Javascript:
var data = [4, 8, 15, 16, 23, 42];
var x = d3.scale.linear()
.domain([0, d3.max(data)])
.range([0, 420]);
d3.select(".chart")
.selectAll("div")
.data(data)
.enter().append("div")
.style("width", function(d) { return x(d) + "px"; })
.text(function(d) { return d; });
推荐答案
c $ c>< div> 可见。
You are missing the CSS necessary to make your <div> visible.
添加：
.chart div {
background-color:red;
border:1px solid blue;
}
这篇关于在d3js中创建基本条形图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
