https://github.com/olymo/leafletpolylinepoints

Leaflet plug-in to add circular points on polyline coordinates.
https://github.com/olymo/leafletpolylinepoints

circle coordinates javascript js leaflet openstreetmap point polyline vue2-leaflet

Last synced: about 6 hours ago
JSON representation

Leaflet plug-in to add circular points on polyline coordinates.

• Host: GitHub
• URL: https://github.com/olymo/leafletpolylinepoints
• Owner: Olymo
• License: mit
• Created: 2020-07-19T17:58:51.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-07-19T19:10:36.000Z (over 4 years ago)
• Last Synced: 2024-11-20T01:18:13.047Z (2 months ago)
• Topics: circle, coordinates, javascript, js, leaflet, openstreetmap, point, polyline, vue2-leaflet
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/@whatsaaaaa/leafletpolylinepoints
• Size: 5.86 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @whatsaaaaa/leafletpolylinepoints

Leaflet plug-in to add circular points on polyline coordinates.

## Install

```

npm i @whatsaaaaa/leafletpolylinepoints

```

## Usage

```js

import { addCircularPointToPolyline } from "@whatsaaaaa/leafletpolylinepoints";

addCircularPointToPolyline(

  [

    {

      latitude: route.latitude,

      longitude: route.longitude,

    },

  ],

  map,

  {

    color: "red",

    bindPopup: true,

    popupContent: `Popup Content!`,

  }

);

```

## Parameters

- coordinates: Array of objects (lat, lng)

- map: Obhect

- options: Object

## Options

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

- bindPopup - Default 'false'. On click binds popup.

- popupContent - What to show in popup.

## Recommended CSS

```css

.polyline-point > div {

  margin-left: -1px;

  margin-top: -3px;

  transform-origin: center center;

}

```