https://github.com/knownasilya/google-maps-drawing-tools

Tools for drawing different types of shapes/items on a Google Map
https://github.com/knownasilya/google-maps-drawing-tools

frontend google-maps google-maps-drawing google-maps-markup typescript

Last synced: 8 days ago
JSON representation

Tools for drawing different types of shapes/items on a Google Map

• Host: GitHub
• URL: https://github.com/knownasilya/google-maps-drawing-tools
• Owner: knownasilya
• License: mit
• Created: 2018-02-08T16:42:31.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2024-02-10T18:29:51.000Z (9 months ago)
• Last Synced: 2024-10-25T13:18:47.259Z (22 days ago)
• Topics: frontend, google-maps, google-maps-drawing, google-maps-markup, typescript
• Language: TypeScript
• Homepage: https://google-maps-drawing-tools.netlify.app
• Size: 1.45 MB
• Stars: 8
• Watchers: 3
• Forks: 0
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# google-maps-drawing-tools

Have you noticed that Google Maps has two ways to draw and both have different options? Well this

library tries to have a unified way to draw that allows exporting geojson and restoring drawings from

existing geojson.

## Install

```sh

npm install --save google-maps-drawing-tools

```

## Usage

```js

import DrawingManager from 'google-maps-drawing-tools';

const map = new google.maps.Map(element, mapOptions);

const manager = new DrawingManager({ map });

// Load geojson

manager.data.addGeoJson(geoJson);

// Can also use 'line', 'circle', 'rectangle' and 'marker'

manager.changeTool('polygon');

// Draw a polygon on the map..

manager.data.toGeoJson((geojson) => {

  // access the geojson

});

```

[API Documentation][api]

## TODO

- [ ] Add Text Label

- [ ] Add measurement option

- [ ] Add measurement units option

- [ ] etc..

[api]: https://knownasilya.github.io/google-maps-drawing-tools/