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

Redraw function seems to be broken #228

Open
andrei-ng opened this issue Aug 26, 2024 · 6 comments
Open

Redraw function seems to be broken #228

andrei-ng opened this issue Aug 26, 2024 · 6 comments
Labels
good first issue Good for newcomers

Comments

@andrei-ng
Copy link
Collaborator

Reported by @Ionizing in #141

I just migrated to the latest plotly.rs (v0.9.0) [...]

However, after the migration, I find something unexpected:

  1. The height of the graph seems to be fixed to several px instead of 100% of browser window;
  2. The redraw on resize function is broken, I have to refresh the page after the resize to get the graph rendered with new width.

Here are two HTML files: dos.zip

  • the old one is produced by old plotly.rs with plotly.js of v2.2.1;
  • the new one is produced by the latest plotly.rs with plotly.js of v2.12.1.

My machine:

  • macOS 13.5.1 (x86_64)
  • Chrome 127.0.6533.99 Official Build x86_64
@andrei-ng andrei-ng added the good first issue Good for newcomers label Aug 26, 2024
@Ionizing
Copy link
Contributor

It seems that the "responsive": true is missing in the latest plotly.rs. The redraw function will work if "config": {} is rewrote as "config": { "responsive": true }. This correction can be accomplished by setting

plot.set_configuration(Configuration::new().responsive(true))

However, the height of the plot is still fixed to some value and cannot fit the height of the window.

@Ionizing
Copy link
Contributor

Finally get the redraw work by adding these lines to the tail of html:

function resizeGraph() {
  Plotly.relayout("plotly-html-element", {
    width: window.innerWidth,
    height: window.innerHeight
  });
}
window.addEventListener('resize', resizeGraph);
resizeGraph();

It means we re-implemented the responsive function to replace the original one, and the config: { responsive: true } is no longer needed.

@Ionizing
Copy link
Contributor

I just added this function to templates/plot.html. I don't think it is an elegant patch but if it does solves the problem without breaking anything else, I'd like to open a PR. Improvements are welcome.

@rmburg
Copy link
Contributor

rmburg commented Sep 15, 2024

[...]

However, the height of the plot is still fixed to some value and cannot fit the height of the window.

I managed to make it fit to the size of the window by using

plot.set_configuration(Configuration::default().responsive(true).fill_frame(true));

@Ionizing
Copy link
Contributor

[...]
However, the height of the plot is still fixed to some value and cannot fit the height of the window.

I managed to make it fit to the size of the window by using

plot.set_configuration(Configuration::default().responsive(true).fill_frame(true));

Great job! It resolves my problem.

@andrei-ng I think this issue can be closed. Maybe it's a good idea to mention this issue or add an example in the documentation in case someone need automatic redraw and window filling function.

@andrei-ng
Copy link
Collaborator Author

@andrei-ng I think this issue can be closed. Maybe it's a good idea to mention this issue or add an example in the documentation in case someone need automatic redraw and window filling function.

Agreed. Will close it when I add an example in the examples/book.

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

No branches or pull requests

6 participants
@andrei-ng @Ionizing @rmburg and others