`useResizeHandler` does not respond to container layout changes

Đang mở
#380 7 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
65/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
javascript, react
Lĩnh vực
data-visualization, frontend

Hướng nghiên cứu

Bắt đầu từ triển khai useResizeHandler và theo dõi cách nó hiện đăng ký theo dõi window.resize. Kiểm tra các test hiện có về việc xử lý thay đổi kích thước, sau đó xác minh rằng các thay đổi đối với phần tử plot đã được render sẽ kích hoạt việc thay đổi kích thước, trong khi fallback của window.resize vẫn hoạt động. Công việc được xem là hoàn tất khi các thay đổi của layout có thể thu gọn làm thay đổi kích thước plot mà không cần gọi thủ công Plotly.Plots.resize().

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

enhancement P3 size: 1

Currently, useResizeHandler only responds to window.resize events.

This works when the browser viewport changes, but it does not cover layout changes that resize the plot without resizing the window.

For example, if a page contains a collapsible sidebar and a responsive plot in the same page, toggling the sidebar changes the space available to the plot, but no window.resize event is fired. The plot therefore keeps its previous size until Plotly.Plots.resize() is called manually.

Would it make sense for useResizeHandler to react to changes in the rendered plot element's size instead of only listening to window.resize?

One possible approach would be to use ResizeObserver when available, while keeping the existing window.resize listener as a fallback.

Ngôn ngữ chính
JavaScript
Star
1.1k
Fork
138
Merge trung bình
3 ngày 2 giờ
Pull request đã merge (30 ngày)
4

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của plotly/react-plotly.js

Tất cả issue của plotly/react-plotly.js

Issue tương tự

Thêm issue về JavaScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.