A11y: Outline and apply texture to property polygons in the map

marvieqa commented 8 months ago

Description

The properties shown in the map are hard to distinguish and differentiate; boundaries are unclear and the priority is only conveyed through color alone. To make it visually accessible, we should outline and apply texture on the property polygons.

Potential Solutions

Apply 1.5-2px outline on property polygon (black or near black color #313537)
Apply texture fill as an additional indicator for priority

Sample screenshot when properties are outlined
![Screenshot 2024-03-24 at 22 40 35](https://github.com/CodeForPhilly/vacant-lots-proj/assets/102739972/be2e06f5-ee0f-4165-9e12-8baba3ade766)

For Considerations

At high zoom (out) levels, the outline and the pattern applied to the polygons can drastically diminish the color coding, making the experience more ambiguous and counter-intuitive. We should explore:

Only outline polygons at lower zoom levels
- Identify the minimum zoom level when we start to show the outlined polygons
Only fill the polygons with texture at lower zoom levels
- Identify the minimum zoom level when we start to show the texture

We should explore, test & iterate on this idea.

Amberroseweeks commented 7 months ago

Hello, i'd like to look into this a little more, specifically the pattern apporach. I think this will require some reading and research to figure out how to put pattern on the polygon in MapTiler. I'm going to start spending some time looking into it.

Amberroseweeks commented 7 months ago

Just sharing some notes from a brief huddle with @thansidwell

Potential Options: Right now we are using the dataviz map style from Map Tiler, if we use a different style, Open Street Map then we can use their raster patterns and also upload our own vector patterns as well along with a stroke to the polygon. We can possibly create a range of patterns to help describe the low, medium, and high range.

Concerns/Questions: -How will patterns and stroke look when zoomed out, should we apply it only on certain zoom levels? -Will anything need to be done for the the dot view version of the map? -Should we continue to use green, yellow, and red? The green can be confused with the greenery on the map (we can remove greenery on the Open Streets Map though) should we consider a different color? -Can we make an experimental version of the map including the patterns and stroke and test with users?

Tagging @marvieqa and @bacitracin for thoughts as well!