Skip to content

Instantly share code, notes, and snippets.

Last active February 22, 2019 23:02
What would you like to do?
d3.time.scale nice
license: gpl-3.0
<!DOCTYPE html>
<meta charset="utf-8">
.axis text {
font: 10px sans-serif;
.axis path,
.axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
<script src="//"></script>
var margin = {top: 100, right: 100, bottom: 100, left: 100},
width = 960 - margin.left - margin.right,
height = 500 - - margin.bottom;
var x = d3.time.scale()
.domain([new Date, new Date])
.range([0, width]);
var svg ="body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + + margin.bottom)
.attr("transform", "translate(" + margin.left + "," + + ")");
.attr("class", "x axis")
Copy link

kylelk commented Jan 17, 2014

Thank you, This was very helpful and easy to understand

Copy link

Hi Mike. Thanks for this great framework!

I'm using your d3.v5 scaleTime and timeFormat with this basic approach (hopefully this line is sufficient for context):

I'm just wondering if you can think of some way I could change the axis label text? In my case eg. I would like to go to -10000 but it only prints "0000" (4 digit limit).


Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment