I have created the d3 time axis,
//minDate and maxDates are javascript date object.
var timeScale =d3.scaleTime().domain([minDate,maxDate]).range(
[0, width]);
var timeAxis = d3.axisBottom(timeScale);
And i have added the zoom interaction to this axis
//gX is group div that has timeAxis.
gX.call(d3.zoom(timeScale).scaleExtent([0,4]).on("zoom",function(d){
//Do something.
}))
but initially i want to set the zoom level of the axis in day level,default it is showing in hour level,So finally what i am curious is,
- How to limit the zooming boundary between years level and min zoom level to day level?
- what does numbers [0,4] represent in scaleExtent([0,4]) in zooming?
I have created the d3 time axis,
//minDate and maxDates are javascript date object.
var timeScale =d3.scaleTime().domain([minDate,maxDate]).range(
[0, width]);
var timeAxis = d3.axisBottom(timeScale);
And i have added the zoom interaction to this axis
//gX is group div that has timeAxis.
gX.call(d3.zoom(timeScale).scaleExtent([0,4]).on("zoom",function(d){
//Do something.
}))
but initially i want to set the zoom level of the axis in day level,default it is showing in hour level,So finally what i am curious is,
- How to limit the zooming boundary between years level and min zoom level to day level?
- what does numbers [0,4] represent in scaleExtent([0,4]) in zooming?
- 4 Good luck! D3 seems to be a mystery to itself. Unfortunately all the documentation out there by Mike Bostock (great programmer as he is, he's absolutely awful at explaining things in a simple, straightforward way), is pretty much useless for anyone who is not prepared to spend at least a month in learning how to create a simple line graph. Powerful library, but most people are simply reduced to copying Mikes code example and tweaking it to do what they want - without fully understanding the code they end up with. Wish there was an alternative with shallower learning curve, would dump D3! – Homunculus Reticulli Commented Sep 8, 2017 at 15:07
- @HomunculusReticulli you are right, the guy has made no efforts whatsoever to simplify stuff like real time graphs, time series pan zoom etc – PirateApp Commented Aug 17, 2018 at 7:53
2 Answers
Reset to default 3I know this is 4 years old post. Back then were there no documentation? This seems to explain pretty thoroughly.
[k0, k1] where k0 is the minimum allowed scale factor and k1 is the maximum allowed scale factor, and returns this zoom behavior. If extent is not specified, returns the current scale extent, which defaults to [0, ∞]. The scale extent restricts zooming in and out.
From what i understand it's the times factor of the zoom. 4 would be mean: magnified 4 times.