Worldmap heatmaps show data by coloring each region on a map, making it easy to see where values are high or low at a glance. They help you quickly spot geographic trends and differences.
| Name | Description | Type | Required | Default |
translate | Sets the translation and scale of the worldmap | { x: number; y: number; scale: number } | No | { x: 0, y: 0, scale: 0 } |
gradient | Sets the gradient color of the worldmap as heatmap | linear-gradient(${string}) | No | - |
className | Custom class name for the SVG element | string | No | - |
Custom styling can be applied by targeting the class names below. Each class corresponds to a specific element for precise theming and overrides.
| Class Name | Element |
worldmap | The base SVG element that wraps all countries. |
worldmap__country | The path element representing individual country shapes. |