Sphere
Component to render the outline for the map graticule. You can also use the sphere component to mask the rest of the map. This is particularly useful for interrupted projections.
import { Sphere } from "react-simple-maps"
js
Example
The following is an example showing the sphere
component highlighted in a different color than the graticule.
Masking
Sphere masking can be particularly helpful when using more creative map projections, like the Waterman Butterfly projection. This example shows how to mask geographies and the graticule properly.
Keep in mind that masking using clip-path
can have an adverse effect on performance, when combined with ZoomableGroup
.
Name | Type | Default |
---|---|---|
id | String | rsm-sphere |
fill | String | transparent |
stroke | String | currentcolor |
strokeWidth | Number | 0.5 |