leaflet.js 地图制作初篇

This_尘渊

于 2018-10-30 16:34:46 发布

阅读量3.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： leaflet.js地图制作文章标签：地图 leaflet

本文链接：https://blog.youkuaiyun.com/lonly_maple/article/details/83089722

本文介绍了使用leaflet.js库创建地图的基础步骤，包括引入文件、初始化地图、加载地图及设置中心点。还提到了参数设置、地图事件、图层与控件方法，以及如何修改和获取地图状态。适合初学者快速上手。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ps：我所讲解的内容都是，最基础的，基本项目中都会用到的方法等，如有特殊需求，请参考官方文档。另外某些效果的实现与插件的使用，应为版本问题，需要修改源码，官网直接下载的是不可用的。

1.初步加载地图

首先引入必要的css与js文件


<link href="../../leaflet/leaflet.css" rel="stylesheet">
<script src="../../script/jquery-1.11.3.js"></script>
<script src="../../leaflet/leaflet-src.js"></script>

然后利用js初步加载地图

<div id="map" style="width:100%;height:100%;"></div>

<script>
    var _map;
    _map= new L.Map('map');
</script>

此时地图容器加载完成，为了能够看到影像，我们要加载地图，并设置地图中心点，此处已加载天地图为例，设置中心点为北京。

//影像地图图层
var _baseImgLayer= new L.tileLayer('http://t{s}.tianditu.cn/DataS

最低0.47元/天解锁文章