leaflet · 初体验

1.      首先关于地图的组件有很多，leaflet就是其一，Leaflet 是一个开源的 JavaScript 库，用于在网页上创建交互式地图。它提供了一系列易于使用的函数和方法，使开发者可以轻松地添加地图、标记、图层和交互功能。
2.       通过命令下载插件leaflet    npm install leaflet --save； 下载完成后引入

       import L from "leaflet";

       import "leaflet/dist/leaflet.css"

3.       创建地图容器：在HTML文件中添加一个 `
   ` 元素，用于作为地图的容器。                        html中
4. 如图： 进行初始化显示地图，页面加载时调用此方法；
5. 定位到某个视图 ： a:  this.map.flyTo([lat,lon],地图缩放层级);[具有平移效果]；                                             b://点位  var position= [lat, lng];
    //把map定位到点位上，13为地图的级别
   this.map.setView(position, 13);
6. 关于 地图上:                                                                                                                  图标标记 : let myIcon = L.icon({
       iconUrl: “图片路径”,
       iconSize: [16, 16]   //图片大小
   });                                                                                                              L.marker([lat,lon], {icon: myIcon}).addTo(map);

    绘制线： var parisKievLL = [

                       [39.89854, 116.3347],

                       [39.62222,116.2066],

                       [39.2305, 116.223333]

                   ];                                                                                                       L.polyline(parisKievLL).addTo(this.map);