我正在尝试在d3中制作一个简单的条形图,但是我的代码中没有错误,只能得到一个空白页。我不确定发生了什么,因为我使用了教程中的功能来正确格式化数据。我将包括一个csv文件示例以及代码。
BeaconMac,UserMac,Date
Office,Michael Albanese,6-Mar-2015
Office,Michael Albanese,6-Mar-2015
Treatment Room,Michael Albanese,6-Mar-2015
Office,Michael Albanese,6-Mar-2015
Treatment Room,Michael Albanese,6-Mar-2015
Office,Michael Albanese,6-Mar-2015
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="chart"></div>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
d3.csv("data.csv", function(data){
var dateFormat = d3.time.format('%m/%d/%Y');
var numberFormat = d3.format('.2f');
data.forEach(function(d){
d.dd = dateFormat.parse(d.date);
d.month = d3.time.month(d.dd);
d.close = +d.close;
d.open = +d.open;
});
//width and height
var w = 500;
var h = 100;
//the svg element
var svg = d3.select("body")
.append("svg")
.attribute("width", w)
.attribute("height", h);
svg.selectAll("rect")
.data(data)
.enter()
.append("rect")
.attribute("x", 0)
.attribute("y", 0)
})
</script>
</body>
</html>
最佳答案
您的代码暗示您有一个csv,其中包含四列,标题为date
,dd
,close
和open
。但是,您的csv
看起来没有这些列。它具有标题为BeaconMac
,UserMac
和date
的三列。
我也看不到如何用这些数据制作条形图。您有一个日期类别和两个字符串类别。为了制作条形柱,您需要一些数字。