Vue 2 components for Leaflet maps

Related tags

Maps map vuejs vue leaflet
Overview

Vue2Leaflet

All Contributors

ci

Downloads Version License

Vue2Leaflet is a JavaScript library for the Vue framework that wraps Leaflet making it easy to create reactive maps.

How to install

npm install vue2-leaflet leaflet --save

For more detailed information you can follow the Quick Start Guide

Breaking change from 1.x.x to 2.x.x

A new major release 2.0.0 is available and come with two breaking changes:

Leaflet is not automatically installed anymore

Leaflet is now a peerDependency and need to be installed manually, we updated our docs to reflect this but please pay attention when migrating

Importing the library in Webpack / Rollup

Now the code of vue2-leaflet is split component by component (while using a bundler like Webpack/Rollup/Parcel) to do so the following syntax is not working anymore:

import Vue2Leaflet from 'vue2-leaflet'; // INVALID

And has been replaced by

import * as Vue2Leaflet from 'vue2-leaflet'; // VALID

Is highly suggested to import only the needed modules by doing so:

import { LMap, LTileLayer, LMarker } from 'vue2-leaflet';

This will reduce the size of the bundle significantly

Documentation

Go here to check out live examples and docs.

Support & Community

Do you have questions? Ideas? do you want to collaborate but you feel lost? Join us on discord Invite Link

Leaflet Plugins

Vue2Leaflet has a wide array of plugins written by the community! Check Here

Contribute

# clone the repository
git clone https://github.com/vue-leaflet/Vue2Leaflet.git
cd Vue2Leaflet
# install dependencies and build vue2-leaflet
npm install
# Compile the source and start the documentation server
npm run dev

Go to http://localhost:8080/ to see the docs and the examples

Any changes to the source code is reflected in the docs after a handfuls of seconds.

Authors

  • Mickaรซl Bouchaud
  • Nicolรฒ Maria Mezzopera

Inspired by many map wrapper (google and leaflet) for many framework (React, Angular and Vue 1.0)

Contributors


Nicolรฒ Maria Mezzopera

๐Ÿ’ป ๐Ÿšง ๐Ÿ“–

Mickaรซl

๐Ÿ’ป ๐Ÿšง

bezany

๐Ÿ’ป

Michael Underwood

๐Ÿ’ป

Michael Wolf

๐Ÿ’ป

Emanuele Bertoldi

๐Ÿ’ป

javiertury

๐Ÿ’ป

ECO

๐Ÿ’ป

Udo Schochtert

๐Ÿ›

Yaman Ozakin

๐Ÿ›

Andre-John Mas

๐Ÿ“– ๐Ÿ’ป

George Pickering

๐Ÿ“–

Jake Potrebic

๐Ÿ’ป

itanka9

๐Ÿ“– ๐Ÿ’ป

bravik

๐Ÿ“–

Pierre Grimaud

๐Ÿ“–

Andrei Rosca

๐Ÿ’ป

If you believe you should be on this list please add yourself by typing this on a PR or issue: @all-contributors please add @yourNickname for X where X is one of all-contributors emojoi keys

And all the rest who contributed

License

This project is licensed under the MIT License - see the LICENSE file for details

Comments
  • vue-marker not displaying on map and map not fully rendering

    vue-marker not displaying on map and map not fully rendering

    Description

    Steps to Reproduce

    1. installed Vue2Leaflet via npm
    2. created a component called Simplewith the following contents (just copied the Simple.vue example and added the style import)
    
    <template>
      <div class="simple">
        <div id="top_div" style="height: 100%">
          <v-map :zoom="zoom" :center="center" style="height: 1000px; width: 1000px">
            <v-tilelayer :url="url" :attribution="attribution"></v-tilelayer>
            <v-marker :lat-lng="marker"></v-marker>       
          </v-map>
        </div>
      </div>
    </template>
    
    <script>
     import Vue2Leaflet from 'vue2-leaflet';
     
    export default {
      name: 'simple',
      components: {
        'v-map': Vue2Leaflet.Map,
        'v-tilelayer' :Vue2Leaflet.TileLayer,
        'v-marker': Vue2Leaflet.Marker
      },
      data () {
        return {
            zoom: 13,
            center: [47.413220, -1.219482],
            url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
            marker: L.latLng(47.413220, -1.219482),
        }
      }
    }
    </script>
    
    <style>
     @import "~leaflet/dist/leaflet.css";
    </style>
    

    Expected Results

    I expect to see the basic map with marker from the example jsfiddle.

    Actual Results

    The map appears as a large gray box with a small section with rendered map tiles. My problem looks identical to the one described in #81 , but I do include the leaflet css import.

    leaflet

    What is strange is that when I resize the window, the map loads as it should, but the marker does not show up. I see in the html that the marker is loaded, however: leaflet2

    Browsers Affected

    • [x ] Chrome
    • [x ] Firefox
    • [ ] Edge
    • [ ] Safari 9
    • [ ] Safari 8
    • [ ] IE 11

    Versions

    • Leaflet: v1.2.0
    • Vue: v2.5.2
    • Vue2Leaflet: v0.0.55
    help wanted wontfix Docs 
    opened by qualisign 47
  • Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

    Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

    Hey KoRiGaN.

    I just installed Vue2-leaflet 0.0.60 to my project and followed your simple example on how to set it up, which works. The problem appears when i'm trying to add a popup or tooltip to my markers. The error happens on load and whenever i hover over a marker / clicks on a marker.

    Error:

    Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

    I have the following code:

    <v-map :zoom="zoom" :center="center">
        <v-tilelayer :url="url" :attribution="attribution"></v-tilelayer>
            <v-marker v-for="marker in markers" :key="marker.id" :visible="marker.visible" :draggable="marker.draggable" :lat-lng="marker.position">
                <v-popup :content="marker.tooltip" />
                <v-tooltip :content="marker.tooltip" />
          </v-marker>
    </v-map>
    
    <script>
    import Vue2Leaflet from 'vue2-leaflet';
    
    export default {
        name: 'vuejscomponent',
        components: {
            'v-map': Vue2Leaflet.Map,
            'v-tilelayer': Vue2Leaflet.TileLayer,
            'v-popup': Vue2Leaflet.Popup,
            'v-marker': Vue2Leaflet.Marker,
            'v-tooltip': Vue2Leaflet.Tooltip
        },
        data () {
            return {
                zoom: 14,
                center: [51.505, -0.09],
                url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
                attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
                markers: [
                    { id: "m1", position : {lat:51.005, lng:-0.09}, tooltip: "tooltip for marker3", draggable: true, visible: true },
                    { id: "m2", position : {lat:50.7605, lng:-0.09}, tooltip: "tooltip for marker4", draggable: true, visible: false }
                ],
                options: { permanent: true, custom: true, className: 'tooltipBox', custom: true, dashOffset: "" }
            }
        }
    }
    </script>
    

    Got any suggestion how to fix this?

    opened by Fillah 34
  • Rewrite docs with gridsome / vuepress / nuxt

    Rewrite docs with gridsome / vuepress / nuxt

    Currently the docs are written in docsify, and they have several problem of not loading partials and similar.

    Having proper working docs is paramount and we should rewrite them in a more stable approach.

    Vuepress or Gridsome seem to be the best candidates.

    We should also ditch the examples folder for storbybook.

    Docs confirmed 
    opened by DonNicoJs 29
  • Leaflet version and version lock [FOR PLUGIN DEVS  / USERS]

    Leaflet version and version lock [FOR PLUGIN DEVS / USERS]

    After two days of debugging I finally managed to grasp an issue that I was having on some personal projects ( vue people and others ). As it stands leaflet used to export itself to the window object, in more recent version they also have an es6 module version. Most of the leaflet plugins uses the window object so they keep exporting it. Now there are some edge cases that completely breaks both vue2-leaflet and the plugins if there is a mismatch version from what version vue-leaflet declare is different from the one declared both in the vue-leaflet-plugin and the leaflet-plugin.

    I'll make an example with markercluster plugin. vue-leaflet declare as dependency leaflet: 1.3.4 leaflet.markercluster declare as dependency: leaflet 1.3.1

    They are just patch releases so it should be all fine.

    What happens instead is that webpack see the two differences and load two leaflet instances. now everything still works MINUS when:

    leaflet markercluster declare a new class say: const a = new LatLngBounds([lat, lon]). and then uses the leaflet method to check if that bound intersect with other markers. Since that method check a instanceof LatLngBounds and that LatLngBounds is coming from a DIFFERENT leaflet instance that check will pass false and then everything will start behaving bad / breaking

    Everything is fine if all the leaflet versions are set at the same since only one distance of leaflet is instantiated. @jperelli

    EDIT FOR CLARITY:

    A solid workaround for this is to use Aliases to point to a single leaflet root instance, for example in nuxt 1.x ( I believe 2.x too ) one would do:

    build: {
      extend(config){
        config.resolve.alias['leaflet'] = path.join(__dirname, 'node_modules/leaflet');
      }
    }
    
    opened by DonNicoJs 29
  • Vue 3 Plan

    Vue 3 Plan

    Hi everyone, this issue is going to be the entry point for the discussion on what to do about vue3.

    Due to the name of the repo ( which I can't change since I am not the owner ) I foresee some user confusion.

    Also I would like to integrate the code with some ci/cd tools and bots to make my life more easy, but I can't since I have no access to the settings...

    I see two options moving forward:

    • fork, rename move from there
    • keep working here, accept that the users are going to be confused.

    If a fork is done, due to limited time I am going to drop support of this repo and keep offering security updates / bug fixes on the new codebase.

    Everyone is free to comment here but I am tagging the people who committed the most.

    @bezany @HIMISOCOOL @mikeu @javiertury @jericopulvera @jperelli

    confirmed 
    opened by DonNicoJs 27
  • Not fully rendering Map and markers

    Not fully rendering Map and markers

    Have the problem with map: not fully rendering Map.

    My application work using vuejs-templates and vue-loader. And I found some problem with webpack and Vue2Leaflet, after that I add to my main.js next lines:

    import L from 'leaflet';
    delete L.Icon.Default.prototype._getIconUrl;
    
    L.Icon.Default.mergeOptions({
      iconRetinaUrl: require('leaflet/dist/images/marker-icon-2x.png'),
      iconUrl: require('leaflet/dist/images/marker-icon.png'),
      shadowUrl: require('leaflet/dist/images/marker-shadow.png')
    });
    

    And after that, I have the same issue.

    My component:

    <template>
      <div>
        <l-map style="height: 90%" :zoom="zoom" :center="center">
          <l-tile-layer :url="url" :attribution="attribution"></l-tile-layer>
          <l-marker :lat-lng="marker"></l-marker>
        </l-map>
      </div>
    </template>
    
    <script>
    import { LMap, LTileLayer, LMarker } from 'vue2-leaflet';
    export default {
      name: 'example',
      components: {
        LMap,
        LTileLayer,
        LMarker
      },
      data () {
        return {
          zoom:13,
          center: L.latLng(47.413220, -1.219482),
          url:'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
          attribution:'&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
          marker: L.latLng(47.413220, -1.219482),
        }
      },
      methods: {
        mounted() {
            setTimeout(function() { window.dispatchEvent(new Event('resize')) }, 250);
        }
      }
    }
    </script>
    

    Result rendering map:

    screen shot 2018-04-15 at 3 01 01 pm

    Question:

    How it fix? @KoRiGaN do you have any ideas?

    opened by ximet 25
  • How to add layer-group into control-layers

    How to add layer-group into control-layers

    In official documentation, Leaftlet shows me to use L.control.layers(baseMaps, overlayMaps).addTo(map); to add baseMaps and overlayMaps to control layer. How can I do that with l-layer-group and l-control-layers?

    I checked the example, it has the only baseMaps option.

    Make an example, I want to add this layer group, it is a set of markers, how do I add another checkbox on control-layers to become overlayMaps?

    <l-tile-layer
        layerType="base"
        name="Default Base"
        :url="url"
    />
    <l-layer-group :visible="sourceVisible">
        <l-marker
             v-for="(item, index) in sources"
             :key="index"
             :lat-lng="[item.coordinates[1], item.coordinates[0]]"
             :icon="sourceIcon(item.icon)"
             @l-click="onClick(item)"
        >
        </l-marker>
    </l-layer-group>
    

    Thank you.

    opened by sangdth 23
  • index.d.ts does not include exported member L

    index.d.ts does not include exported member L

    While importing L from module using import {L} from 'vue2-leaflet'; an error is being thrown: Module '"vue2-leaflet"' has no exported member 'L'.

    And we CANNOT use import from leaflet directly because some functions fail checks because leaflet sometimes uses instanceof and it is a huge app size increase.

    Versions

    • Leaflet: v1.3.4
    • Vue: v2.5.21
    • Vue2Leaflet: v1.2.3
    opened by drafu 19
  • No toolbar for draw?

    No toolbar for draw?

    Hi guys,

    Im trying to add a toolbar to draw geometric figures like this example using the native leaflet library: http://leaflet.github.io/Leaflet.draw/docs/examples/full.html

    But I didnt found nothing to get it work with vue2-leaflet.

    This is possible to do with this lib?

    Thanks!

    opened by jlpereira 17
  • build error Cannot find namespace 'L'

    build error Cannot find namespace 'L'

    Description

    hello everyone i use [email protected] & typescript template but i got a build error

    Steps to Reproduce

    just execyarn build

    Expected Results

    No error is throw

    Actual Results

    image

    opened by manooog 17
  • @click event not working inside l-icon

    @click event not working inside l-icon

    Description

    I've been trying to make a custom marker icon which reacts to mouse events (basically triggers a function call on click). Unfortunately this doesn't seem to work

    Live Demo

    https://jsfiddle.net/nvcqw7d2/2/

    Steps to Reproduce

    Open above JSFiddle

    Expected Results

    Clicking on a element in the red box should open a alert

    Actual Results

    Nothing happens

    Browsers Affected

    • [X] Chrome
    • [X] Firefox
    • [ ] Edge
    • [ ] Safari 9
    • [ ] Safari 8
    • [ ] IE 11

    Versions

    • Leaflet: v1.5.0
    • Vue: v2.15.6
    • Vue2Leaflet: v2.2.1
    wontfix 
    opened by bestmazzo 16
  • chore(deps): bump express from 4.17.1 to 4.18.2

    chore(deps): bump express from 4.17.1 to 4.18.2

    Bumps express from 4.17.1 to 4.18.2.

    Release notes

    Sourced from express's releases.

    4.18.2

    4.18.1

    • Fix hanging on large stack of sync routes

    4.18.0

    ... (truncated)

    Changelog

    Sourced from express's changelog.

    4.18.2 / 2022-10-08

    4.18.1 / 2022-04-29

    • Fix hanging on large stack of sync routes

    4.18.0 / 2022-04-25

    ... (truncated)

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • chore(deps): bump qs from 6.5.2 to 6.5.3

    chore(deps): bump qs from 6.5.2 to 6.5.3

    Bumps qs from 6.5.2 to 6.5.3.

    Changelog

    Sourced from qs's changelog.

    6.5.3

    • [Fix] parse: ignore __proto__ keys (#428)
    • [Fix] utils.merge`: avoid a crash with a null target and a truthy non-array source
    • [Fix] correctly parse nested arrays
    • [Fix] stringify: fix a crash with strictNullHandling and a custom filter/serializeDate (#279)
    • [Fix] utils: merge: fix crash when source is a truthy primitive & no options are provided
    • [Fix] when parseArrays is false, properly handle keys ending in []
    • [Fix] fix for an impossible situation: when the formatter is called with a non-string value
    • [Fix] utils.merge: avoid a crash with a null target and an array source
    • [Refactor] utils: reduce observable [[Get]]s
    • [Refactor] use cached Array.isArray
    • [Refactor] stringify: Avoid arr = arr.concat(...), push to the existing instance (#269)
    • [Refactor] parse: only need to reassign the var once
    • [Robustness] stringify: avoid relying on a global undefined (#427)
    • [readme] remove travis badge; add github actions/codecov badges; update URLs
    • [Docs] Clean up license text so itโ€™s properly detected as BSD-3-Clause
    • [Docs] Clarify the need for "arrayLimit" option
    • [meta] fix README.md (#399)
    • [meta] add FUNDING.yml
    • [actions] backport actions from main
    • [Tests] always use String(x) over x.toString()
    • [Tests] remove nonexistent tape option
    • [Dev Deps] backport from main
    Commits
    • 298bfa5 v6.5.3
    • ed0f5dc [Fix] parse: ignore __proto__ keys (#428)
    • 691e739 [Robustness] stringify: avoid relying on a global undefined (#427)
    • 1072d57 [readme] remove travis badge; add github actions/codecov badges; update URLs
    • 12ac1c4 [meta] fix README.md (#399)
    • 0338716 [actions] backport actions from main
    • 5639c20 Clean up license text so itโ€™s properly detected as BSD-3-Clause
    • 51b8a0b add FUNDING.yml
    • 45f6759 [Fix] fix for an impossible situation: when the formatter is called with a no...
    • f814a7f [Dev Deps] backport from main
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • chore(deps): bump decode-uri-component from 0.2.0 to 0.2.2

    chore(deps): bump decode-uri-component from 0.2.0 to 0.2.2

    Bumps decode-uri-component from 0.2.0 to 0.2.2.

    Release notes

    Sourced from decode-uri-component's releases.

    v0.2.2

    • Prevent overwriting previously decoded tokens 980e0bf

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.1...v0.2.2

    v0.2.1

    • Switch to GitHub workflows 76abc93
    • Fix issue where decode throws - fixes #6 746ca5d
    • Update license (#1) 486d7e2
    • Tidelift tasks a650457
    • Meta tweaks 66e1c28

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.0...v0.2.1

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Fix LTooltip options to reactive

    Fix LTooltip options to reactive

    Related: https://github.com/vue-leaflet/Vue2Leaflet/issues/446 LTooltip options is not reactive, so I called unbindTooltip() and bindTooltip() when options are updated.

    https://user-images.githubusercontent.com/22453562/184093911-3d6282df-c49a-4634-a12f-42964bc70751.mov

    opened by kuromoka 1
  • chore(deps): bump terser from 4.8.0 to 4.8.1

    chore(deps): bump terser from 4.8.0 to 4.8.1

    Bumps terser from 4.8.0 to 4.8.1.

    Changelog

    Sourced from terser's changelog.

    v4.8.1 (backport)

    • Security fix for RegExps that should not be evaluated (regexp DDOS)
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
Releases(v2.4.3)
  • v2.2.1(Jul 24, 2019)

    • disableClickPropagation on LControl
    • more unit test
    • memory leak on LMap addressed
    • kebab case event names on marker
    • fix tooltip issues
    • minor fix to LCirlce

    Huge thanks to everybody who put their effort in writing test, patching and enhancing the code

    Source code(tar.gz)
    Source code(zip)
  • v2.1.1(Apr 25, 2019)

  • v2.1.0(Apr 21, 2019)

  • v2.0.3(Apr 20, 2019)

    • Leaflet is now a peerDependecy, please install it manually
    • ES module compilation for tree-shaking
    • l-icon component fixes
    • unit testing boostrap

    Special thanks to @bezany

    Source code(tar.gz)
    Source code(zip)
  • v1.2.0(Nov 8, 2018)

  • v1.1.1(Oct 28, 2018)

    • All the features introduced in 1.1.0
    • Fixed issues introduced in 1.1.0
    • Typescrip support

    Big thanks to @bezany @HIMISOCOOL for the hard work and everyone else who contribute to this release.

    Source code(tar.gz)
    Source code(zip)
  • v1.1.0(Oct 2, 2018)

    This release contain a big refactor of the code an many addition.

    No breaking changes aside some future deprecation warning.

    While it has been tested with all the examples and working application it's important to point out that the codebase has been strongly mutated.

    • Code size reduced by almost 10kb
    • Tooltip and popup performance (dynamic prop added )
    • Codebase now uses linting
    • GeoJson options and style are now reactive (thanks @bezany)
    • Image Overlay additional options

    Feel free to open any Issue if any bug / perplexity is found.

    Marked as pre-release

    Source code(tar.gz)
    Source code(zip)
  • v1.0.1(Mar 27, 2018)

    :warning: Breaking changes from v1.x.x to v0.x.x :warning:

    A new major release v1.x.x is available and come with some breaking changes.

    :exclamation: Components names

    As some component where conflicting with reserved name like Circle with SVG Circle, from v1.x.x all components are prefixed with L.

    For example Marker component became LMarker (l-marker in template).

    :exclamation: Events names

    Event handling have been simplified and are now mapped directly to Leaflet event.

    For example Marker move event was 'l-move' and became simply 'move'.

    :sparkles: Leaflet Controls

    v1.0.0 introduces Leaflet Controls you can now use them using LControlAttribution, LControlLayers, LControlScale and LControlZoom.

    Source code(tar.gz)
    Source code(zip)
React components for Leaflet maps

React Leaflet React components for Leaflet maps. Documentation Getting started API reference Changes See the CHANGELOG file. Contributing See the CONT

Paul Le Cam 4.4k Jan 3, 2023
AngularJS directive to embed an interact with maps managed by Leaflet library

Angular Leaflet Why the fork? While we are grateful for all the original work at tombatossals/angular-leaflet-directive. We need to be able to operate

AngularUI 313 Nov 10, 2022
Mapbox JavaScript API, a Leaflet Plugin

mapbox.js A Mapbox plugin for Leaflet, a lightweight JavaScript library for traditional raster maps. For the state-of-the-art Mapbox vector maps libra

Mapbox 1.9k Dec 23, 2022
This is the leaflet plugin for GeoServer. Using this plugin user can have access to wms and wfs request easily.

Documentation leaflet-geoserver-request This is the plugin for Geoserver various kind of requests. Using this plugin, we can make WMS, WFS, getLegendG

Tek Kshetri 127 Dec 15, 2022
Add time dimension capabilities on a Leaflet map.

Leaflet TimeDimension Add time dimension capabilities on a Leaflet map. Examples and basic usage API L.Map L.TimeDimension L.TimeDimension.Layer L.Tim

SOCIB public code 379 Dec 23, 2022
This map is tracking the position of ISS(international space setallite) at every 1 second. I use Nasa's "where the iss" API and "Leaflet.js" for the map.

ISS-tracking-map About This map is tracking the position of ISS(international space setallite) at every 1 second. I use Nasa's "where the iss" API and

Waz.sheeran 2 Oct 25, 2021
Simple location picker on Leaflet map

Leaflet Location Picker Simple location picker with Leaflet map Usage: <label>Insert a Geo Location <input id="geoloc" type="text" value="" /> </lab

Stefano Cudini 37 Nov 17, 2022
:leaves: JavaScript library for mobile-friendly interactive maps

Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 39 KB of gzipped JS plus 4 KB of gzipp

Leaflet 36.5k Jan 1, 2023
An open-source JavaScript library for world-class 3D globes and maps :earth_americas:

CesiumJS is a JavaScript library for creating 3D globes and 2D maps in a web browser without a plugin. It uses WebGL for hardware-accelerated graphics

Cesium 9.7k Dec 26, 2022
the easiest way to use Google Maps

Important If you're developer, I'm moving gmaps.js to NPM, you can give your opinion and check the migration progress in Issue #404 gmaps.js - A Javas

Gustavo Leon 7.1k Dec 28, 2022
Polymaps is a free JavaScript library for making dynamic, interactive maps in modern web browsers.

Polymaps Polymaps is a free JavaScript library for making dynamic, interactive maps in modern web browsers. See http://polymaps.org for more details.

Urban Airship 1.6k Dec 23, 2022
UNMAINTAINED Open source JavaScript renderer for Kartograph SVG maps

This project is not maintained anymore. Here are a few reasons why I stopped working on kartograph.js: there's no need to support non-SVG browsers any

null 1.5k Dec 11, 2022
An open-source JavaScript library for world-class 3D globes and maps :earth_americas:

CesiumJS is a JavaScript library for creating 3D globes and 2D maps in a web browser without a plugin. It uses WebGL for hardware-accelerated graphics

Cesium 9.7k Jan 3, 2023
the easiest way to use Google Maps

Important If you're developer, I'm moving gmaps.js to NPM, you can give your opinion and check the migration progress in Issue #404 gmaps.js - A Javas

Gustavo Leon 7.1k Apr 7, 2021
This is a collection of over two hundred code samples an growing for the Bing Maps V8 web control.

Bing Maps V8 Code Samples This is a collection of over a hundred code samples for the Bing Maps V8 web control. These samples have been collected from

Microsoft 130 Dec 8, 2022
This project contains the TypeScript definitions for the Bing Maps V8 Web Control.

Bing Maps V8 TypeScript Definitions These are the official TypeScript definitions for the Bing Maps V8 Web Control. These can be used to provide intel

Microsoft 35 Nov 23, 2022
Converts geojson to svg string given svg viewport size and maps extent.

geojson2svg Converts geojson to svg string given svg viewport size and maps extent. Check world map, SVG scaled map and color coded map examples to de

Gagan Bansal 163 Dec 17, 2022
Downloads satellite images from Google Maps, only slightly illegal.

Google Maps Satellite Downloader This is a script to download satellite images from Google Maps. The below mentioned optimization system requires that

null 5 Oct 31, 2022
A simple web extension that redirects Twitter, YouTube, Instagram & Google Maps requests to privacy friendly alternatives.

Get Donate FIRO aEyKPU7mwWBYRFGoLiUGeQQybyzD8jzsS8 BTC: 3JZWooswwmmqQKw5iW6AYFfK5gcWTrvueE ETH: 0x90049dc59365dF683451319Aa4632aC61193dFA7 About A web

Simon Brazell 1.6k Dec 29, 2022