https://github.com/windycom/leaflet-kml
🌎Leaflet KML layer plugin
https://github.com/windycom/leaflet-kml
Last synced: 11 months ago
JSON representation
🌎Leaflet KML layer plugin
- Host: GitHub
- URL: https://github.com/windycom/leaflet-kml
- Owner: windycom
- Created: 2019-05-30T04:52:41.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2022-11-08T22:43:22.000Z (over 3 years ago)
- Last Synced: 2024-04-23T14:42:20.128Z (about 2 years ago)
- Language: JavaScript
- Size: 388 KB
- Stars: 159
- Watchers: 8
- Forks: 73
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# Leaflet KML layer plugin
Demo: https://www.windy.com/uploader
This plugin was extracted from Pavel Shramov's Leaflet Plugins [repository](https://github.com/shramov/leaflet-plugins) in order to maintain this code more frequently and separate KML layer from other plugins.
So far we have fixed few issues.
Probably will work on Leaflet 1+, tested on Leaflet 1.4.
## How to use
```html
// Make basemap
const map = new L.Map('map', { center: new L.LatLng(58.4, 43.0), zoom: 11 });
const osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
map.addLayer(osm);
// Load kml file
fetch('assets/example1.kml')
.then(res => res.text())
.then(kmltext => {
// Create new kml overlay
const parser = new DOMParser();
const kml = parser.parseFromString(kmltext, 'text/xml');
const track = new L.KML(kml);
map.addLayer(track);
// Adjust map to show the kml
const bounds = track.getBounds();
map.fitBounds(bounds);
});
```
## Licence
MIT