No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Oliv
Oliv Fixes shared renderer
Instances the renderer in initialize function
Latest commit 597e990 Jun 7, 2018

README.md

leaflet-polycolor NPM version Build Status

Color each polyline segment

Installation

npm

$ npm install --save leaflet-polycolor

browser

  • Download or clone this github project
  • Include dist/polycolor.min.js in your project

compile

  • Download or clone this github project
  • Run npm i in the project folder
  • Run npm run build

Demo

Demo

Usage

es6

import L from 'leaflet';
import leafletPolycolor from 'leaflet-polycolor';
leafletPolycolor(L);

const map = L.map('map', {
    center: [45.1834782, 5.7831946],
    zoom: 13
});

L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar'}).addTo(map);

const latLngs = [[45.187273, 5.758124], [45.182772, 5.758516], [45.185767, 5.747106], [45.176569, 5.752082], [45.171863, 5.757120], [45.168354, 5.755178]];
const colors = ['rgb(20, 200, 100)', 'rgb(200, 100, 20)', null, null, 'rgb(20, 200, 100)', 'rgb(0, 0, 0)'];

const polyline = L.polycolor(latLngs, {
  colors: colors,
  weight: 5
}).addTo(map);

normal include of the minified file

<script src="leaflet-polycolor.min.js"></script>
var leafletPolycolor = require('leaflet-polycolor');
leafletPolycolor.default(L);

var map = L.map('map', {
    center: [45.1834782, 5.7831946],
    zoom: 13
});

L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar'}).addTo(map);

var latLngs = [[45.187273, 5.758124], [45.182772, 5.758516], [45.185767, 5.747106], [45.176569, 5.752082], [45.171863, 5.757120], [45.168354, 5.755178]];
var colors = ['rgb(20, 200, 100)', 'rgb(200, 100, 20)', null, null, 'rgb(20, 200, 100)', 'rgb(0, 0, 0)'];

var polyline = L.polycolor(latLngs, {
  colors: colors,
  weight: 5
}).addTo(map);

API

Factory L.polycolor(<LatLng[]> latlngs, <Polyline options> options?)

Options

  • colors <Array> : An array of rgb colors strings rgb(x,y,z)

If colors are undefined, the default color parameter is used. To leave default color, use null in colors. ['rgb(0, 0, 0)', null, 'rgb(0, 45, 120)']

clip and smoothFactor parameters are disabled for now, planned in v1.0.0.

License

MIT © Olivier Gasc