看这篇文章: https://www.cnblogs.com/developer-sue/p/9201640.html 很好quq
1、默认情况下，地图上所有的鼠标和触摸的交互控件都是激活的。
2、大部分的Leaflet方法在不返回明确的数值是都是返回一个对象
var mymap = L.map('mapid').setView([51.505, -0.09], 13);
(是座标，还有最大缩放的倍数。好的， 那我们先改改这个试试？3、添加图层
创建一个图层通常需要涉及到为图层设置URL模板，图层的属性文本和缩放的最大级别。在当前例子下，运用Mapbox中的经典地图的 mapbox.streets 图块（为了从Mapbox中运用图块，必须请求token）
titleLayer是指基础图层的元素
L.tileLayer('网址(带token)',{
maxZoom:15,
attribution:(文字描述) id:///,
}).addTo(myMap);
看起来是图层添加流啊…… 这个最大放大倍数，然后你看啊，最开始那个setView那里是，，，，现在的，缩放到的倍数是什么（现在是第几层）这个参数不是什么有几层的限制呀1是最大，后面依次变小了qwq。。
这个标记的话，直接。。你在setView那里多少层， 你添加上了的就是多少层。。
嗯，这个层呢是基于它这样来画的，如果不添加地图信息也可以直接画多边形~~~ 只需要给端点就可以自己连了，更普适一点，canvas可做但是有点笨重？这个更漂亮了呢qwq。。地图说不定可以换个背景?..
var polygon = L.polygon([ [51.509, -0.08], [51.503, -0.06], [51.51, -0.047]]).addTo(mymap); //初始化一个多边形,自定义样式如circle
可以在之前创建的变量名字上。。。续加这个bindPop，可以点击触发哟quq
marker.bindPopup(
还有可以是var popup
var popup = L.popup() .setLatLng([51.5, -0.09]) .setContent("I am a standalone popup.") .openOn(mymap);
latlang应该是座标最后附上代码，直接到html文件里就可以运行
前面那两句...~~ 没有下载leaflet的话，也可以用连网资源
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"/>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>leaflet</title>
<link rel="stylesheet" href="./leaflet.css"/>
<script src="./leaflet.js"></script>
</head>
<body>
<div id="mapid" style="width:600px;height:400px;"></div>
<script type="text/javascript">
var mymap = L.map('mapid').setView([51.505, -0.09], 12); //（地理座标，缩放等级）
//titleLayer是指基础图层的元素
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 15, //最大放大倍数
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
id: 'mapbox.streets', //地图类型，不强制选择图层的提供方，可替换mapbox.satellite等
}).addTo(mymap);
var marker = L.marker([51.5, -0.09]).addTo(mymap); //初始化添加一个标记 (
var circle = L.circle([51.5, -0.05], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius: 500
}).addTo(mymap);
//初始化一个边框red，内部背景颜色#f03，透明度0.5，半径为500的圆圈范围
var polygon = L.polygon([ [51.509, -0.08], [51.503, -0.06], [51.51, -0.047]]).addTo(mymap); //初始化一个多边形,自定义样式如circle
marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup(); //openPopup()初始化界面时触发
circle.bindPopup("I am a circle."); //点击触发
polygon.bindPopup("I am a polygon.");
//这里我们使用openOn而不是addTo是因为当开启一个新的气泡点时将自动关闭上一个打开的气泡点,这样提高了使用性
var popup = L.popup() .setLatLng([51.5, -0.09]) .setContent("I am a standalone popup.") .openOn(mymap);
var popup = L.popup(); //声明（初始化）一个弹窗
function onMapClick(e) {
console.log(e.latlng)
popup .setLatLng(e.latlng) .setContent("You clicked the map at " + e.latlng.toString()) .openOn(mymap); //点击时通过e.latlng显示该点座标
}
mymap.on('click', onMapClick); //点击时触发onMapClick事件
</script>
</body>
</html>