Vue.js使用Leaflet地图

继续探索地图插件，想试试Leaflet：

Leaflet 是一个为建设移动设备友好的互动地图，而开发的现代的、开源的 JavaScript 库。它是由 Vladimir Agafonkin 带领一个专业贡献者团队开发，虽然代码仅有 33 KB，但它具有开发人员开发在线地图的大部分功能。

Leaflet设计坚持简便、高性能和可用性好的思想，在所有主要桌面和移动平台能高效运作，在现代浏览器上会利用HTML5和CSS3的优势，同时也支持旧的浏览器访问。支持插件扩展，有一个友好、易于使用的API文档和一个简单的、可读的源代码。

Leaflet用的坐标系是wgs84，所以不需要转换百度或者高德地图。

我找到一个看似还不错的插件，叫做vue2-leafle，在正式开始之前，我下载了Demo，按照它给的教程，使用npm install命令安装了一些多需要安装的包。然后打开Demo，效果非常惊艳！

测试Example

# Run demo at localhost:8080
$ npm link
$ cd examples
$ npm link vue2-leaflet
$ npm install
# serve with hot reload at localhost:8080
$ npm run dev

上述就是Demo示例，看起来挺不错的。在example文件夹下的Component中，有一堆vue文件，很有用，以后可以直接粘贴抄袭……

开始开发

首先安装包在自己的文件目录下：

npm install -save vue2-leaflet

不需要做任何的main中的配置，直接可以在Component文件夹中写一个vue文件。代码如下

<template>
  <el-row>
  <h2>Simple map</h2>
    <p>Marker is plac