leaflet为页面做准备:

在你开始你的地图代码之前,你为页面需要做好以下几步准备:

-引入在文档头部leaflet的css文件:

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>

–紧接着引入leaflet的JS文件:

<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>

–在你希望引入地图的位置处键入一个有id的div:（要有明确的高度）

<div id="mapid"></div>

创建地图:

var mymap = L.map('mapid').setView([51.505, -0.09], 13);

或

var map = L.map('map', {
                center: [40, 100],
                zoom: 4
            });

转载自：https://blog.csdn.net/black2Girl/article/details/85261923