简体   繁体   中英

D3js Changing ticks on Zoomable Time axis

Background

I have a zoomable time graph which I build incorporating the following code:

var x = d3.time.scale().range([0, 100]);
var xAxis = d3.svg.axis()
    .scale(x)
    .tickFormat(customformatter);

When the appropriate interval is years, it shows ticks of years. Months shows months, etc.

Problem

This works wonderfully, generating great ticks until I zoom down into weeks, at which point I need to be able to dictate what day of the week ticks show for (Sunday, monday, etc.). I am aware of the multiformat custom generator for tickFormat in which you can specify the format given the appropriate interval. That will not change the ticks, however. Is there a way to set the start of the weeks' rules while maintaining the tick generation that otherwise exists at the year, month, day (etc.) level? Can the default start date be set to some other day of the week for the d3 library?


This is hardly a recommendable answer to my own question, but if anyone is desperate one way is to override the source code in /src/time/week.js:

d3_time.week = d3_time.sunday;
d3_time.weeks = d3_time.sunday.range;
d3_time.weeks.utc = d3_time.sunday.utc.range;
d3_time.weekOfYear = d3_time.sundayOfYear;

Just swap out 'sunday' for another day of the week.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM