|
|
|
@ -192,35 +192,14 @@ formatTime(new Date()); //returns a string in the above format
|
|
|
|
|
|
|
|
|
|
|
|
## Axes
|
|
|
|
## Axes
|
|
|
|
|
|
|
|
|
|
|
|
- Create the x axis
|
|
|
|
```javascript
|
|
|
|
|
|
|
|
var leftAxis = d3.axisLeft(yScale); //create a left axis based on the yScale
|
|
|
|
```javascript
|
|
|
|
d3.select('svg')
|
|
|
|
var xAxis = d3.svg.axis();
|
|
|
|
.append('g') //append a group element
|
|
|
|
```
|
|
|
|
.call(leftAxis); //apply the axis to it
|
|
|
|
|
|
|
|
```
|
|
|
|
- Associate the scale with the axis
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
|
|
|
xAxis.scale(xScale);
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
- Set where on the graph the axis should appear
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
|
|
|
xAxis.orient('bottom');
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
- Set the number of ticks
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
|
|
|
xAxis.ticks(8);
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
- Append a group containing the axis after data has populated the scale
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
Different types of axes: https://github.com/d3/d3-axis#axisTop
|
|
|
|
viz.append('g').call(yAxis);
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Events
|
|
|
|
## Events
|
|
|
|
|
|
|
|
|
|
|
|
|