d3.js/axes.js at master · rainmaker29/d3.js · GitHub

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

var data= [80, 100, 56, 120, 180, 30, 40, 120, 160];

var svgWidth = 500, svgHeight = 300;

var svg = d3.select('svg')
   .attr("width", svgWidth)
   .attr("height", svgHeight);

var xScale = d3.scaleLinear()
   .domain([0, d3.max(data)])
   .range([0, svgWidth]);

var yScale = d3.scaleLinear()
   .domain([0, d3.max(data)])
   .range([svgHeight, 0]);

var x_axis = d3.axisBottom()
   .scale(xScale);

var y_axis = d3.axisLeft()
   .scale(yScale);

svg.append("g")
   .attr("transform", "translate(50, 10)")
   .call(y_axis);

var xAxisTranslate = svgHeight - 20;

svg.append("g")
   .attr("transform", "translate(50, " + xAxisTranslate  +")")
   .call(x_axis);