date - How to format brushed time axis (with context-dependent values) -
i have x axis years 2009 - 2016 tickvalues. when select time period time widget, tick values become combination of month names , years (thank this, d3!). have 'december, 2014, february' example. selecting narrower range gives me week names , dates e.g. 'june 14'.
i month names appear shortened format, e.g. dec, feb. know d3.time.format('%b'), can't set tickformat without impacting years (which come out 'jan').
how apply context-dependent tickformat d3 time scale axis?
i believe looking d3.time.format.multi:
for example:
var customtimeformat = d3.time.format.multi([ [".%l", function(d) { return d.getmilliseconds(); }], [":%s", function(d) { return d.getseconds(); }], ["%i:%m", function(d) { return d.getminutes(); }], ["%i %p", function(d) { return d.gethours(); }], ["%a %d", function(d) { return d.getday() && d.getdate() != 1; }], ["%b %d", function(d) { return d.getdate() != 1; }], ["%b", function(d) { return d.getmonth(); }], ["%y", function() { return true; }] ]); //use custom time format var xaxis = d3.svg.axis().scale(x).orient("bottom").tickformat(customtimeformat); here's working js fiddle: https://jsfiddle.net/f5fgm9dt/8/
i found helpful: http://bl.ocks.org/mbostock/4149176
Comments
Post a Comment