search

carbonplan / maps

interactive multi-dimensional data-driven web maps
https://maps.demo.carbonplan.org
Other
212 stars 18 forks source link

Problem customizing RegionPicker component #104

Open Jakidxav opened 10 months ago

Jakidxav commented 10 months ago

I am having trouble customizing the <RegionPicker /> component. I want to create a <RegionPicker /> with a set radius without the floating handle, similar to the look and functionality of the region picker in the ncview-js package. I feel like this should be as easy as setting the FLOATING_HANDLE variable to False before it gets read into the <CircleRenderer /> component, but I am having trouble mixing pre-built components from imports ('@carbonplan/components') and customizing them from src/.

simplified_region_picker

I want to be able to see the value (or average value) of the <Raster /> component within particular cells at a given resolution (~1km, in my case). However, this is problematic when the minRadius prop is quite small, where the floating handle blocks grabbing and moving the <RegionPicker />. I experimented with creating a <RegionPicker /> with a set radius (minRadius = maxRadius), but didn't have any luck there, either, as the floating handle just spins around the central point without moving at lower resolutions.

default_region_picker region_picker_close_up

Would the dev team consider adding in the ability to remove the floating handle portion of the <RegionPicker /> via a prop in the future?

katamartin commented 2 weeks ago

Hey @Jakidxav thanks for issue and sorry for the delay!

You are right that the floating handle is always rendered, and it looks like this is controlled by this constant. It should be relatively straightforward to convert that constant into a prop passed down to the CircleRenderer component, but we would need to test this. We don't have capacity to implement ourselves right now, but could definitely review a PR if you have the time and are still interested in this feature!