最近做了个利用leaflet展示各个国家的某些数据的网站,现把入门过程记录下来。最终效果图:
leaflet 网站
官方网站: http://leafletjs.com/
本入门教程主要是做的 Interactive Choropleth Map,官网上教程的链接是http://leafletjs.com/examples/choropleth/。
leaflet 的一个小demo
Mapbox
首先使用leaflet,我们需要一个地图,官网上的例子都是使用的mapbox地图,所以我们需要先去mapbox官网上去注册一下。
Mapbox 官网链接地址:https://www.mapbox.com/
1. 注册,并登陆之后,点击右上角的“studio”标签.
2. 到达如下页面,点击“new style标签”:
3. 选择“basic”,点击“create”
到达如下页面:
由于我要做的是一个最基础的展示页面,我们只需要这个世界地图就可以了。
4. 点击左上角的分享的图标。。
5. 在跳转的页面中,点击“share,develop & use”
6. 然后点击“leaflet”标签
然后再下面的文本框中,就会显示出leaflet所要引用的URL,把这个URL记录下来,以后要用: