| 1 | ---
|
| 2 | layout: example.html
|
| 3 | title: Styling feature with CanvasGradient or CanvasPattern
|
| 4 | shortdesc: Example showing the countries vector layer styled with patterns and gradients.
|
| 5 | docs: >
|
| 6 | First this example creates a reusable [`CanvasPattern`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern)
|
| 7 | and a [`CanvasGradient`](https://developer.mozilla.org/en/docs/Web/API/CanvasGradient). The countries are loaded from
|
| 8 | a GeoJSON file. A style function determines for each country whether to use a fill with the pregenerated
|
| 9 | CanvasGradient (rainbow colors) or a CanvasPattern (repeating stacked circles).
|
| 10 | tags: "canvas, gradient, pattern, style"
|
| 11 | ---
|
| 12 | <div id="map" class="map"></div>
|