You must be logged in to post your query.
Home › Forums › Chart Support › Graph with constant x axis and changing y axis
Is there a way determine a constant range for the X axis, and the values will be changed by the Zoom ?
For example – if I have 5000 points overall from year 2000 to 2017, and the range is 50, it will show me 5000/50 points “together” as 1 line. and if i’m at zoom level of 3000 points in the X axis, it will show me 3000/50 points “together”, and if the zoom level is very large, and I see only <50 points in the X axis, it will show me 50/50 = 1 points “together” – it’s the basic “resolution” like I have now – sorted by single days…
Currently i’m using this graph with zoomable option: https://canvasjs.com/javascript-charts/multi-series-line-chart/
it’s great, but to implement what I want, I need to react to event of zooming on some X – range, and change the Data to present accordingly accumulated in range. How can I do it ?
@johnsnowthedeveloper,
Based on selected range, you can filter the dataPoints, update it and render the chart. Please have a look at this jsfiddle.
___ Suyash Singh Team CanvasJS
It looks good i’ll check it out. I also ment to accumulate the number so the bars will be fewer on full view, by i’ll try to do it using the range functionality available in the example. thanks.
How can I access the range? If I console log it it shows me that the range is undefined
console.log(e.axisX.viewportMaximum) console.log(e.axisX.viewportMinimum)
The output is undefined
Ok I managed to figure it out, your example is not full. But thanks!
You can use the event parameter of rangeChanging() to access viewportMinimum and viewportMaximum. You can access axis as an array (e.axisX[0]), sorry for the inconvenience caused & we have updated jsfiddle for the same.
Thank you
How can I find my maximum Y value in the zoomed rate?
Please have a look at this jsfiddle.
You must be logged in to reply to this topic. Login/Register