data-for-change / anyway-newsflash-infographics

Development branch deployed automatically to website:
https://anyway-infographics-staging.web.app/
MIT License
12 stars 23 forks source link

[Feat] Map - Concatenate date labels in FE for near or exact-location accidents #648 #1117

Open atalyaalon opened 2 months ago

atalyaalon commented 2 months ago

Is your feature request related to a problem? Please describe.

Widget Name: most_severe_accidents

Currently, accidents can overlap if they are close to each other or have the same GPS location (as shown in the Screen shot). It's impossible to know how many accidents are overlapping and move their labels so at least the labels are not overlapping (simply because you can't select the accident that is not on top). ANYWAY

For example: in this location in widget most_severe_accidents there are 6 accidents in the exact same location with the exact same GPS, but we only see some of the dates instead of all of the dates on the map.

Screenshot 2024-06-22 at 17 33 31

What should be done: In FE - in case accidents are in the exact same location or close enough - "join" them to one accident icon (not a "flower" cluster like we see in anyway but one single icon), and consolidate all dates into one label with all dates presented next to the accident icon. Regarding icon color: I suggest the icon color will be by the most severe accident - fatal if fatal otherwise severe , and later we'll create a unique icon that combines both if both fatal and severe are at the same "joint" location. @galraij can you take care of a joint icon of both severe and fatal accidents (both red and orange)?

Another option which is less preferable if the above suggestion is problematic: It can be done with "flower" version, just like ANYWAY map and like we considered in the past BUT only if the labels with dates are always visible - meaning flower is always open. If we're using the "flower" version (in which many icons are tied with lines to one point on the map) have the dates presented next to each icon in a readable way.