Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

While the graph updates the live data the resetZoom() does not happen correctly #918

Open
GitCatacao opened this issue Jan 4, 2025 · 2 comments

Comments

@GitCatacao
Copy link

GitCatacao commented Jan 4, 2025

While the graph updates the live data the reset does not happen correctly in a graph made like this (sorry if it is too skimpy). You know what it is if you have done it.
The example is unfortunately too big to be reported here on github.
It is a financial chart with added volumes.
Two series, one volume and one interchangeable line/candlestick/ohlc.

The zoom when reset remains set to the last zoomed size.

I don't know if you can fake it, but if you can you will realize that the problem exists and it is quite annoying.

						zoom: { //plugin
							zoom: {
								wheel: {
									enabled: true,
								},
								pinch: {
									enabled: true
								},
								mode: 'x',
								limits: {
									x: {min: 0, max: 100},
								},
								onZoomStart: ({ chart, event, point }) => {
									drawOnChartZoomButton();
								},
							},
						},
....

		<div class="chart-container" id="chart-container">
			<canvas id="chart"></canvas>
		    <div id="menu_chart">
				<script>
				resetZoomBtn = (chart) => {
					chart.resetZoom()
				};
				</script>
		    	<button id="button_reset_mainchart_zoom" type="button" class="btn btn-secondary" onclick="resetZoomBtn(chart); this.style = 'display: none;';" style="display:none;">🧐</button>
		    </div>
		</div>



If you need further details just ask.

@alcalyn
Copy link

alcalyn commented Jan 20, 2025

If I understand what you say, I think I have the same problem. To reproduce:

  • Have a chart showing data from e.g 1st january to 15 january
  • Add data in the future or past: the chart will auto adapt x axis to show new value
  • Now, zoom somewhere in the chart
  • Add data in the future or past again:

I expect that chart adapt again, like it did earlier.

Currently I have: the chart x axis no longer adapt after I zoomed once, like it's stuck.

Actually, I think my use case is expected, if we zoom in, if there is new data outside, it's expected to keep the range.

But in the case of @GitCatacao, I think you should try:

-chart.resetZoom()
+chart.resetZoom('zoom')

I also need to pass mode = "zoom" to resetZoom to work

@GitCatacao
Copy link
Author

GitCatacao commented Jan 21, 2025

@alcalyn

Have a chart showing data from e.g 1st january to 15 january
Add data in the future or past: the chart will auto adapt x axis to show new value
Now, zoom somewhere in the chart
Add data in the future or past again

Yes, something like that, pink squirrel with things in the eye, but the the following is different: chart adapts, but it adapts to the last zoom, as if that were the entire area of ​​the chart.

About the parameter zoom you pass to the function chart.resetZoom: not true.
Look @ the function reset zoom.
It has a default value for transition. Exactly default (what a paradox)

function resetZoom(chart, transition = 'default') {
	const state = getState(chart);
	const originalScaleLimits = storeOriginalScaleLimits(chart, state);
	helpers.each(chart.scales, function(scale) {
		const scaleOptions = scale.options;
		if (originalScaleLimits[scale.id]) {
			scaleOptions.min = originalScaleLimits[scale.id].min.options;
			scaleOptions.max = originalScaleLimits[scale.id].max.options;
		} else {
			delete scaleOptions.min;
			delete scaleOptions.max;
		}
		delete state.updatedScaleLimits[scale.id];
	});
	chart.update(transition);
	helpers.callback(state.options.zoom.onZoomComplete, [{chart}]);
}

so you can pass also nothing like this:

chart.resetZoom() // Reset zoom still works. But it is bugged.

Goodbye 👋

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants