-
Notifications
You must be signed in to change notification settings - Fork 0
/
test.js
88 lines (66 loc) · 2.16 KB
/
test.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
//d3.select("body")
// .style("color", "black")
// .style("background-color", "green");
//d3.select("body")
// .append("div")
// .style("background-color", "lightblue")
// .html("Hello, world!");
//var data = [4, 8, 15, 16, 23, 42];
var width = 420,
barHeight = 20;
var x = d3.scale.linear()
.range([0, width]);
var chart = d3.select(".chart")
.attr("width", width);
//data = d3.csv("data.csv",
// function(data) {
// x.domain([
// 0, d3.max(data,
// function(d) {
// return d.fill_lvl;
// })
// ]);
// });
var width = 420,
barHeight = 20;
var x = d3.scale.linear()
.range([0, width]);
var chart = d3.select(".chart")
.attr("width", width);
d3.tsv("data.tsv", type, function (error, data) {
x.domain([0, d3.max(data, function (d) { return d.value; })]);
chart.attr("height", barHeight * data.length);
var bar = chart.selectAll("g")
.data(data)
.enter().append("g")
.attr("transform", function (d, i) { return "translate(0," + i * barHeight + ")"; });
bar.append("rect")
.attr("width", function (d) { return x(d.value); })
.attr("height", barHeight - 1);
bar.append("rect")
.style("fill", "red")
.attr("width", function (d) { return x(d.value2); })
.attr("height", barHeight - 1);
bar.append("text")
.attr("x", function (d) { return x(d.value) - 3; })
.attr("y", barHeight / 2)
.attr("dy", ".35em")
.text(function (d) { return d.value; });
});
function type(d) {
d.value = +d.value; // coerce to number
return d;
}
//chart.attr("height", barHeight * data.length);
//var bar = chart.selectAll("g")
// .data(data)
// .enter().append("g")
// .attr("transform", function (d, i) { return "translate(0," + i * barHeight + ")"; });
//bar.append("rect")
// .attr("width", function (d) { return x(d.fill_lvl); })
// .attr("height", barHeight - 1);
//bar.append("text")
// .attr("x", function (d) { return x(d.fill_lvl) - 3; })
// .attr("y", barHeight / 2)
// .attr("dy", ".35em")
// .text(function (d) { return d.fill_lvl; });