https://github.com/olymo/leafletpolylinedirection

Leaflet plug-in to add direction indicators on existing Polylines.
https://github.com/olymo/leafletpolylinedirection

javascript leaflet openstreetmap vue vue2-leaflet

Last synced: about 1 month ago
JSON representation

Leaflet plug-in to add direction indicators on existing Polylines.

• Host: GitHub
• URL: https://github.com/olymo/leafletpolylinedirection
• Owner: Olymo
• License: mit
• Created: 2020-07-19T00:16:03.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-07-19T16:05:31.000Z (over 4 years ago)
• Last Synced: 2024-11-16T11:18:53.097Z (about 2 months ago)
• Topics: javascript, leaflet, openstreetmap, vue, vue2-leaflet
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/@whatsaaaaa/leafletpolylinedirection
• Size: 19.5 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @whatsaaaaa/leafletpolylinedirection

Leaflet plug-in to add direction arrows on existing Polylines.

## Install

```

$ npm i @whatsaaaaa/leafletpolylinedirection

```

## Usage

```js

import { createDirectionIndicators } from "@whatsaaaaa/leafletpolylinedirection";

createDirectionIndicators(coordinates, mapObject, {

  numberOfIndicators: 1,

  color: "red",

});

```

## Parameters

- coordinates: Array

- mapObject: Object

- options: Object

## Options

- numberOfIndicators - Default value 1. If you want more than one indicator between two coordinates, use this property

- color - Default 'blue'. Change the color of indicator

## Recommended CSS

```cs

.direction-indicator {

  width: 8px;

  height: 8px;

}

.direction-indicator > div {

  margin-left: -1px;

  margin-top: -3px;

  transform-origin: center center;

  font: 12px/1.5 'Helvetica Neue', Arial, Helvetica, sans-serif;

}

```