Leaflet.SvgShapeMarkers

Additional SVG marker types for leaflet.js such as triangle, diamond and square. Check out the demo.

Note: Currently only works when preferCanvas isn't set to true.

$3

Either downloading this repo or install from npm
```
npm install leaflet-svg-shape-markers
``

$3

Step 1. Include the required js in your document

`
# With requirejs
require('leaflet-svg-shape-markers')

# Using ES6
import 'leaflet-svg-shape-markers'

# Via a html script

`

Step 2. Add a point to your map using the shapeMarker function

` js
var square = L.shapeMarker([51.505, -0.09], {
shape: "square",
radius: 20
}).addTo(map);
`

Step 3.
You can pass a number of options to the plugin to control various settings.

| Option | Type | Default | Description |
| ------------- |--------------|--------------|---------------|
| shape | string | "triangle" | A valid shape, see list below |
| radius | number | 20 | The size of the svg marker in pixels |
| rotation | number | 0 | The rotation of the svg marker, between 0 and 360 |

L.shapeMarker also extends the path class so any options that you can pass (such as color or fillOpacity) are also valid.

` js
var diamond = L.shapeMarker([51.505, -0.09], {
fillColor: "#cccccc",
color: "black",
shape: "diamond",
radius: 200
}).addTo(map);
`

$3

* diamond
* square
* triangle (= triangle-up)
* triangle-up
* triangle-down
* arrowhead (= arrowhead-up)
* arrowhead-up
* arrowhead-down
* circle
* star-{number-points}
* x

$3

| Method | Returns | Description |
| ------------- |--------------|--------------|
| toGeoJSON | Object | Returns a GeoJSON representation of the marker (as a GeoJSON Point Feature).|
| setLatLng | this | Sets the position of a marker to a new location.|
| getLatLng | LatLng | Returns the current geographical position of the marker.|
| setStyle | this | Changes the appearance of a Path based on the options in the Path options object.|
| getRadius | number | Returns the current radius of the marker.|
| setRadius | this | Sets the radius of a marker. Units are in pixels.|
| getRotation | number | Returns the current rotation of the marker.|
| setRotation | this | Sets the rotation of a marker.|

` js
diamond.setRadius(10);
``

$3

Huge hats off go to mourner and all the contributors to the leaflet.js project, it's an amazing piece of open source software!