EQWorks / widget-studio

Widget-creating tool for charts, maps, tables, stats
https://eqworks.github.io/widget-studio/
2 stars 3 forks source link

[G2M] Map widget - add xwi report logic & ui #122

Closed geoerika closed 2 years ago

geoerika commented 2 years ago

Changes:

Map Widget - visualization for xwi report data

  1. When we select the map widget for xwi report data, first, we will visualize only the existing relationships between source & target POIs. Upon inspection with tooltip, a user can inspect values for source & target POIs, as well as for the arc layer
Screen Shot 2022-06-27 at 12 14 26 PM
  1. The domain value (aggregation key) configuration for each layer is hidden from users, only value configuration is available, for radius, color & arc width for the different layers of the map. The data is aggregated automatically using the POI id keys for the source & target layers in the data object. The data for the arc layer uses a combined "source poi id - target poi id" key to aggregate data.

    Screen Shot 2022-06-27 at 12 15 54 PM
  2. Each of the layers (source, target, arc) can be hidden on the map pressing the eye icon to the right of the layer title

    Screen Shot 2022-06-27 at 12 25 19 PM

Filters:

  1. For group filters I enabled only filtering by Source poi_id as we don't have yet implementation to use all string columns as filters. Currently, the widget only allows the group by column key as a string filter. Screen Shot 2022-06-27 at 12 28 15 PM
  2. Range (value) filters work similarly to the other widgets

Labels:

Labels can also be enabled for the Source & Target layers & they will showcase:

  1. just the POI ids or the title passed through mapTooltipLabelTitles prop (see Source POI name) when no value configuration is selected for the layer
  2. Label title & values of the keys selected for visualizations for the respective layer Screen Shot 2022-06-27 at 12 34 10 PM

Layer Display:

  1. A new control button was added to control Arc Width
  2. If only one layer has visualization set for Radius, the control button for Radius will indicate to which layer the radius value in pixels applies to (see label Target Layerfor Radius Size). Screen Shot 2022-06-27 at 12 41 55 PM

Storybook: https://6139016b390968003a20da5a-nyfuvjxgzy.chromatic.com/?path=/story/editor-mode--dev-map-3

github-actions[bot] commented 2 years ago

📚 Storybook preview (updated to 65c7aa48f28dc19202a0445d1530d81e7f2c4adf)

geoerika commented 2 years ago

having that many POI_ID we will need a better filter group design. Like a searchable multi select thing

Good point. When we are not too tight on time, we can go over WS with the design team & bring any improvements we see fit. It's not a done deal by any means.