Monday 15 August 2011

d3.js - Avoid duplicate dates in d3js axes -



d3.js - Avoid duplicate dates in d3js axes -

i have many charts beingness generated dynamically. charts, dates near each other, so, axis labels getting repeated

example:

date format used:

d3.time.format("%d-%b-%y")

is there in-built way avoid duplication of labels? or there generic procedure can avoid such duplication? note charts have zooming feature , incoming info dynamic, can't set in hardcoded values of "ticks" or "tickvalues". generating ticks or tickvalues dynamically, way go.

thank @lars kotthoff helping out. basic solution:

var ticks = scale.ticks(userspecifiedticks); var nonduplicatetickvalues = []; var tickalreadyexists = function(tickvalin) { for(var i=0;i<nonduplicatetickvalues.length;i++) { var t = nonduplicatetickvalues[i]; var formattedtickvalin = formatter(tickvalin); var formattedtickval = formatter(t); if(formattedtickvalin == formattedtickval) {return true;} } homecoming false; }; var removeduplicateticks = function() { for(var i=0;i<ticks.length;i++) { var tickval = ticks[i]; if(!tickalreadyexists(tickval)) { nonduplicatetickvalues.push(tickval); } } }; scale.tickvalues(nonduplicatetickvalues);

here, formatter function like:

var formatter = function(d){ var format = d3.time.format("%d-%b-%y"); homecoming format(d); }

d3.js charts axis-labels

No comments:

Post a Comment