GIS笔记 | 麻辣GIS

Leaflet笔记(7)在地图上绘制弹出框(Popup)

本文介绍在Leaflet的地图上绘制弹出框（Popup）的方法。什么是Popup？就是类似下面的效果。可以看到在前文绘制的Marker上位置增加了一个弹出的提示框。这个效果在Leaflet中...

2017-02-28

Leaflet笔记(6)在地图上绘制多边形(Polygon)

本文介绍在Leaflet的地图上绘制多边形（Polygon）的方法。先放一个效果图可以看到在前文绘制的圆形的位置增加了一个蓝色边框的多边形。这个方法也比较简单，代码如下： Leaflet绘...

2017-02-27

Leaflet笔记(5)在地图上绘制圆形

上文《Leaflet笔记(4)在地图中添加标记Marker》介绍了使用Leaflet添加Marker的方法。本文介绍在地图上绘制圆形的方法。先放一个效果图可以看到在前文标记Marker的位...

2017-02-26

Leaflet笔记(4)在地图中添加标记Marker

上文《Leaflet笔记(3)加载自定义MapBox地图》介绍了使用Leaflet加载自定义地图方法，下面将介绍系列在地图上交互的方法。本文介绍在地图中添加一个Marker的方法。先放一个效果...

2017-02-25

Leaflet笔记(3)加载自定义MapBox地图

上文介绍了MapBox的简要使用方法，并使用MapBox创建了自定义地图，那么就可以在Leaflet中加载进来。方法如下先放一个效果图这里加载的是一幅卫星地图。复制Leaflet分享地址...

2017-02-23

Leaflet笔记(2)注册并使用MapBox

本文简单介绍一下MapBox及注册使用MapBox的方法。关于MapBox Mapbox是一个在线的地图平台，利用它可以方便的创建（更确切的说是设计）在线地图，其使用的主要数据源为OpenSt...

2017-02-23

Leaflet笔记(1)最简单的入门程序——显示地图

本文实现Leaflet的最基本的功能，在web中加载地图。实现步骤如下: 1.引入Leaflet文件在<head>中加入如下代码： <link rel="style...

2017-02-20

Leaflet学习笔记【更新中】

最近开始入门前端的开发学习，想到最近WebGIS的火热，所以也要给自己找点目标，学点新东西。于是乎开始我的Leafletjs的学习过程，本文将记录我学习Leaflet的一些点滴。关于Leafl...

2017-02-15

[WebGIS] HTML5跟踪GPS轨迹（9）查看走过的轨迹

经过前面对HTML5、VueJS还有百度地图的折腾，剩下的工作也就水到渠成了，接下来我们将通过百度地图查看记录在IndexedDB的位置数据。事件响应首先响应查看地图按钮的点击事件，如图...

2016-11-18

[WebGIS] HTML5跟踪GPS轨迹（8）再谈百度地图的坐标转换（V2版）

在之前的文章《百度地图坐标转换（gps google 百度坐标相互转换》中我曾经简单介绍过百度地图中坐标转换的“坑”。这次在写这个示例的时候发现百度地图JS-API V2发布了，而在新的百度地图...

2016-11-17

[WebGIS] HTML5跟踪GPS轨迹（7）VueJS引入百度地图

通过前文的工作已经可以使用HTML5记录并保存数据，同时实现了应用的相关设置功能。下面的工作就是要查看已经记录下的信息了，当然给我们一个一个的坐标点我们是无法查看出定位效果的。最好的方法还是将定...

2016-11-16

[WebGIS] HTML5跟踪GPS轨迹（6）应用设置功能实现

前文实现了使用HTML5定位并记录信息，其实实现了这一步后面就比较简单了，本文介绍应用设置的功能和实现。响应点击事件在应用设置的按钮上绑定点击的响应函数，如下：响应代码如下，其主要作用是...

2016-11-15

[WebGIS] HTML5跟踪GPS轨迹（5）记录轨迹功能实现

前文《HTML5跟踪GPS轨迹（4）基本界面布局》构架了样式，本文实现记录轨迹的功能。响应点击事件 vue中事件响应比较简单，代码如下：图中红框中的表示响应click事件，代码响应如下 /...

2016-11-14

[WebGIS] HTML5跟踪GPS轨迹（4）基本界面布局

前文已经介绍了我们整个程序的基础技术，一个是地理位置获取（HTML5 Geolocation接口），一个是地理位置存储（HTML5 IndexedDB）。下面进入正题，我们从页面的前端样式开始，...

2016-11-13

[WebGIS] HTML5跟踪GPS轨迹（3）IndexedDB使用精简入门下篇

前文《HTML5跟踪GPS轨迹（2）IndexedDB使用精简入门上篇》中介绍了使用IndexedDB增、删、改、查数据的方法，本文简单介绍IndexedDB另外一个强大的功能：索引。 Inde...

2016-11-07

文章列表：GIS笔记