Skip to content

scrollZoom no longer works when page is scrollable #2371

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.

Sign up for GitHub

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

Jump to bottom
Closed
etpinard opened this issue Feb 15, 2018 · 9 comments · Fixed by #3424
Closed

scrollZoom no longer works when page is scrollable #2371

etpinard opened this issue Feb 15, 2018 · 9 comments · Fixed by #3424
Labels
bug something broken

Comments

@etpinard
Copy link
Contributor

Originally posted https://community.plot.ly/t/scrollzoom-doesnt-work-in-chrome/7356/5

Example: http://marfoldi.web.elte.hu/plotly.html

Possible culprit: #2296
@etpinard etpinard added bug something broken regression this used to work labels Feb 15, 2018
@alexcjohnson
Copy link
Collaborator

I can't reproduce this on any of my browsers (mac OS 10.13, latest Chrome, FF, Safari) - The OP seems to be on Windows, but I guess you see it on Ubuntu as well @etpinard ?

@etpinard
Copy link
Contributor Author

etpinard commented Mar 6, 2018

Yep. I can reproduce on my Ubuntu machine fine. @dfcreative can you double check on Windows?

@dy
Copy link
Contributor

dy commented Mar 6, 2018

@etpinard only the last plot is working, but all three of them should work, that is what I see. Confirm the bug.

@dy dy self-assigned this Mar 6, 2018
@ChristofferHS
Copy link

ChristofferHS commented Mar 21, 2018 •
edited
Loading

In the example linked to in the opening post, none of the plots work for me, neither in Chrome nor Firefox.

A couple of observations (Windows):

  • in the example linked to in the opening post, if I 1) open the developer tools or some other window that hides part of the right-hand side of the plots and then 2) refresh the page so that the plots are drawn less wide and then close window, all the plots are now working for me (both in Chrome and Firefox, but the window that was opened has to be closed first).

  • a div with styling appears to give a working plot for me:

<body>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="plot_0" style="width:110vw;height:100%"></div>
<div id="plot_1"></div>
<div id="plot_2" style="width:70vw"></div>
</body>
<script>
	Plotly.newPlot('plot_0', [{x: [1, 2, 3, 4, 5], y: [1, 2, 4, 8, 16]}], {title: 'has style, can scroll'}, {scrollZoom: true});
	Plotly.newPlot('plot_1', [{x: [1, 2, 3, 4, 5], y: [16, 8, 4, 2, 1]}], {title: 'has no style, cannot scroll'}, {scrollZoom: true});
	Plotly.newPlot('plot_2', [{x: [1, 2, 3, 4, 5], y: [10, 1, 10, 1, 10]}], {title: 'has style, can scroll'}, {scrollZoom: true});
</script>

(for some reason, all plots are scrollable on CodePen with this code)

@marfoldi
Copy link
Contributor

Any news on this one?
Unfortunately for me the additional styling on the div is not resolving the issue.

Thanks,
Peter

@etpinard
Copy link
Contributor Author

@dy have you done any work on this thing?

@etpinard
Copy link
Contributor Author

... and are you still planning on working on this? If not, I'll remove you from the assignee list.

@dy
Copy link
Contributor

dy commented Jul 12, 2018

@etpinard I will devote this issue time tomorrow.

@etpinard etpinard mentioned this issue Jul 26, 2018
Open
marfoldi added a commit to marfoldi/plotly.js that referenced this issue Oct 9, 2018
@marfoldi
NEW - Issue plotly#2371: Not disabling scrollZoom
dc33622 
Used to disable scrollzoom when the plot had scrollbars. Ended up with a plot which is not zoomable with mouse scroll on a page which had additional content (had a scrollbar).
@etpinard etpinard mentioned this issue Oct 9, 2018
Closed
@etpinard etpinard unassigned dy Oct 25, 2018
@alexcjohnson alexcjohnson mentioned this issue Nov 16, 2018
Closed
5 tasks
@mateiz mateiz mentioned this issue Dec 3, 2018
Merged
@etpinard
Copy link
Contributor Author

etpinard commented Jan 9, 2019 •
edited
Loading

Looks like this wasn't a regression, but a bug introduced into newer Browsers.

#2296 isn't the culprit, this block

plotly.js/src/plots/cartesian/dragbox.js

Lines 437 to 442 in 9bbe295

// if the plot has scrollbars (more than a tiny excess)
// disable scrollzoom too.
if(pc.scrollHeight - pc.clientHeight > 10 ||
pc.scrollWidth - pc.clientWidth > 10) {
return;
}

is.

@etpinard etpinard removed the regression this used to work label Jan 9, 2019
@etpinard etpinard mentioned this issue Jan 9, 2019
Merged
@harupy harupy mentioned this issue Oct 13, 2019
Merged
22 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug something broken
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Do not disable scrollZoom scroll{Width,Height} > client{Width,Height} plotly/plotly.js
5 participants
@dy @alexcjohnson @marfoldi @etpinard @ChristofferHS