The Choropleth component displays divided geographical areas shaded in relation to some data variable. It's build on top of primitives from the GeoMap component.
Using this component requires some knowledge about the d3-geo
library, projections, geoJSON⦠please have a look at the
official d3 documentation
for further information.
Like for GeoMap, you must pass an array of features
which determine the geometries to render on the map, then you pass
an array of data which, each datum is merged with its corresponding
feature using the match
property, the value is picked according
to the value
accessor.
Please note that because the features file is pretty huge, it's not included
in the generated code, you can find the file used for this example
here,
you'll have to pass the features
array to the features
property.
The responsive alternative of this component is ResponsiveChoropleth
.
This component also have a canvas implementations,
ChoroplethCanvas, which should be used
when you have complex geometries as it offers better performance.
Chart width.
Chart height.
'Depends on device'
Adjust pixel ratio, useful for HiDPI screens.
Chart margin.
'id'
Label accessor.
'value'
Value accessor.
'value'
Value formatter.
Defines uppper and lower bounds of color shading