[BUG]: Coupled hoverinfo tooltips are misaligned
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
- 45/100
- Loại issue
- Lỗi
- Độ rõ ràng
- Khá rõ ràng
- Mức độ hoạt động
- Đình trệ
- Công nghệ
- javascript
- Lĩnh vực
- data-visualization
Hướng nghiên cứu
Chạy demo.py đính kèm để tạo output.html, sau đó kiểm tra demo.js và tương tác Fx.hover được liên kết trong trình duyệt. So sánh vị trí tooltip và hướng mũi tên của hai heatmap liền kề; hoàn tất khi các tooltip hover được liên kết căn chỉnh nhất quán, đồng thời vẫn giữ hành vi mũi tên tiêu chuẩn ở những nơi phù hợp.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
Description
I have setup a coupled hover effect for two adjacent heatmaps using Fx.hover. As shown in the Gif below, the two hoverinfo boxes don't align. Technically, their arrows do point to the same locations in their respective heatmaps, but the left arrow points sharply upward and the right arrow points sharply downward. I think this makes the visualisation harder to interpret.
Screenshots/Video
This Gif shows the misaligned hoverinfo boxes.
This screenshot shows the misalignment. I have drawn on the blue line for clarity. Note how the left tooltip is below the point, with its arrow pointing upwards, while the right tooltip is above the point, with its arrow pointing downwards. I feel like the tooltips should match one another and be aligned.
These are the arrows that I get when the coupled hover effect is active.
These are the 'standard' arrows that I get when the coupled hover effect is inactive. By this, I mean when I have commented-out the JavaScript that calls Fx.hover to update the tooltips. I would prefer if both tooltips had this style of arrow at all times, except for when the alternative style of arrow is really necessary.
Steps to reproduce
I have attached two files. The Python file creates the plot and then injects the JS file, which handles the coupled hover interaction. Running the Python file creates an output.html file, which you can open in a browser and see the results shown above.
demo.js (~15 lines)
demo.py (~30 lines)
Notes
I considered hiding the tooltip arrows as in #7278 but that would make the issue worse, since the tooltip boxes do not line up with each other.
- Ngôn ngữ chính
- JavaScript
- Star
- 18.3k
- Fork
- 2k
- Merge trung bình
- 2 ngày 10 giờ
- Pull request đã merge (30 ngày)
- 30
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- 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.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của plotly/plotly.js
-
chore P3 plotly-internal size: 3 task
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 77/100
-
bug P2 size: 1
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
-
chore P1 plotly-internal size: 1 task
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 82/100
-
chore P3 plotly-internal size: 1 task
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
-
bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
Tất cả issue của plotly/plotly.js
Issue tương tự
-
bot:ai-assisted component:compact-js status:untriaged
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 84/100
midnightntwrk/midnight-sdk#403 ·
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 92/100
-
Độ khó 1/5 1-3 giờ Mức phù hợp với người mới 86/100
DavidAnson/markdownlint-cli2#940 ·
-
documentation
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 88/100
githubnext/gh-aw-workshop#3692 ·
-
agent/guide documentation hive/hosted-available-lke648397-260827-5n31
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 90/100