feat(data-weaver): choropleth charts - #458
Conversation
There was a problem hiding this comment.
Code Review
This pull request introduces a new choropleth map chart style to the application, enabling geographic data visualization. Key additions include a new API route (/api/geo) to fetch and normalize GeoJSON coordinates, a DataChartChoropleth component featuring pan, zoom, and time-slider animation controls, and helper services for map projections, bounds fitting, and LRU caching. Feedback on the changes highlights a high-severity issue where calling e.preventDefault() inside React's synthetic onWheel handler will throw a console error and fail to prevent page scrolling. The reviewer recommends attaching the wheel event listener directly to the SVG element with { passive: false } via a useEffect hook.
beets
left a comment
There was a problem hiding this comment.
thanks for this! ideally, a lot of this logic needn't live in dataweaver but is something that is easily plugged in. so i'd keep that in mind as we add this here first, that we'd lift this out of the app soon.
| (n.types?.includes('Country') || | ||
| n.types?.includes('State') || | ||
| n.types?.includes('County') || | ||
| n.types?.includes('Place') || | ||
| n.types?.includes('AdministrativeArea1') || | ||
| n.types?.includes('AdministrativeArea2')) |
There was a problem hiding this comment.
let's pull these out as constants
would really prefer if this logic did not live in the app (but in our API / client library), so could you add a TODO
There was a problem hiding this comment.
similarly, logic for pulling down the right resolution level, adding the unwinding logic at processing time, etc.
| [chartSeries], | ||
| ); | ||
|
|
||
| const [isGeoAvailable, setIsGeoAvailable] = useState<boolean | null>(() => { |
There was a problem hiding this comment.
should we pull out the choropleth logic into a subclass (as static helpers perhaps).
There was a problem hiding this comment.
please add documentation to the module
| hovered.y < 60 ? s['tooltip-align-bottom'] : '', | ||
| hovered.x < 80 ? s['tooltip-align-left'] : '', | ||
| hovered.containerWidth !== undefined && | ||
| hovered.x > hovered.containerWidth - 80 |
There was a problem hiding this comment.
please pull out these values as constants. best is if they could be computed.
Description
This PR adds choropleth map visualization for multi-entity geographic comparisons in Data Weaver.
This fills the use case where data for a large number of places, usually children, needs to be displayed on a single chart.
Implementation
/api/georoute to query GeoJSON from the Data Commons API.map_projection.ts) supporting curated regional projections (Lambert Azimuthal for Europe, rotated Equirectangular for Asia/Oceania, Albers USA for US states) and dynamic bounds fitting (map_bounds.ts). This is largely based on the Data Commons website implementation (with some additional landmass filtering).DataChartChoroplethwith SVG pan/zoom, interactive tooltip with value/unit formatting, color ramp legend, andSliderTimefor stepping or auto-playing through temporal observations.Testing
pnpm test,pnpm lint(TypeScript + Biome + Stylelint), andpnpm build.Coming Functionality (all in Tracker)