0.2.0 • Published 5 years ago
leaflet-rain v0.2.0
Leaflet.Rain
WebGL rain animation for Leaflet maps. Extends L.Polygon.
Demo
Installation
works with leaflet@1.0.0 and higher
npm install leaflet
npm install leaflet-rainimport L from 'leaflet';
import 'leaflet-rain';Usage
let map = L.map(...);
let points = [[latlngs], [latlngs], ...],
options = {
angle: 80,
width: 1,
spacing: 10,
length: 4,
interval: 10,
speed: 1,
color: 'Oxa6b3e9'
},
rain = L.rain(points, options).addTo(map);API reference
Factory
| Factory | Description |
|---|---|
L.rain(LatLng[] latlngs, options options?) | Create rain animation inside (multi)polygon with given latlngs. |
Options
| Option | Type | Default | Description |
|---|---|---|---|
| angle | Number | 80 | Rain angle (degrees) |
| width | Number | 1 | Drop width (px) |
| spacing | Number | 10 | X-spacing between drops (px) |
| length | Number | 4 | Drop length (px) |
| interval | Number | 10 | Y-spacing between drops (px) |
| speed | Number | 1 | Rain speed factor. Values greater 1 increase speed |
| color | String | Oxa6b3e9 | Rain color hex value |
Methods
| Method | Description |
|---|---|
setAngle(Number) | Sets rain angle (degrees). |
setWidth(Number) | Sets drop width (px). |
setSpacing(Number) | Sets x-spacing between drops (px). |
setLength(Number) | Sets drop length (px). |
setInterval(Number) | Sets y-spacing between drops (px). |
setSpeed(Number) | Sets rain speed factor. |
setColor(hex string) | Sets rain color. |