WebGIS
文章平均质量分 91
qingyafan
分享云原生、GIS相关技术
展开
-
mapboxgl - 用webgl展示海量数据,是否可行?
Openlayers憋了好久,终于憋出了WebGL的渲染器,然而只支持点要素类型,要是线和面类型的要素,数据量级一上去,就没法用了。我们看看隔壁的Mapboxgl,诞生之日起就是WebGL渲染,而且openlayers新出的WebGLPoint Layer使用的WebGL渲染样式规则也借鉴了Mapboxgl的表达式(Expression)。所以,为什么不用mapboxgl呢?当我想到这个想法的时...原创 2020-04-18 15:28:22 · 5144 阅读 · 6 评论 -
MapServer 之 使用 MySQL 数据
MySQL 从 4.1 开始支持空间数据类型,可能由于历史原因,或者很多技术人员并不了解 GIS,很多空间位置数据存储并没有使用专有的空间数据类型字段,而是使用了两个 float 类型存储,分别代表经度和纬度,经纬度数据一般是来自 GPS 传感器;当然还有一些数据就直接利用了 MySQL 的空间扩展,空间数据表中的 geometry 类型存储空间数据。那么这两种在 MySQL 数据库中存储的空间信息怎么利用呢?原创 2016-05-14 21:03:25 · 10392 阅读 · 0 评论 -
MapServer 之 发布网络覆盖数据服务(WCS-Web Coverage Service)
今天我们讲一下使用 mapserver 发布 OGC 的三大网络地图服务的最后一个 - WCS,wcs 主要是规定了通过网络提供访问 coverage 数据的标准,那么什么是 coverage 数据呢? 狭义的说,可以认为 mapserver wcs 中发布的 coverage 数据就是卫星影像 或者 dem。广义上说,coverage 数据主要是指时空现象的数字表示,可以是多维的,例如一维的传感器原创 2016-03-01 11:31:42 · 5030 阅读 · 0 评论 -
OpenLayers 3 之 实时追踪轨迹-获取最后添加的要素
问题描述 有时,往往有这样的需求:每隔一段时间查询一个物体的位置,然后将这个位置绘制在地图上,中间的点用普通的样式标识,当前位置(也就是最新的点位置)使用一个特殊的样式。我们可以这样实现,查询到一个新位置,将改点添加到地图上的同时,赋予其特殊的样式,当再查询到有新的位置时,获取最后添加的要素,删除其特殊样式,然后添加新的要素点位置。那么,问题来了:怎么获取最后添加的要素呢?原创 2016-01-08 09:09:32 · 8763 阅读 · 3 评论 -
论解决问题的一般做法 - 以 MapServer 为例
当你使用一个开源软件时,遇到问题,是不是一筹莫展呢?因为我们对使用的软件不了解,不出问题还好,如果出了问题,如果没有调试信息,那我们只能自行 百度、Google,就算你连 Bing 都用上,如果你用的软件使用不是很广泛,那找到解决方案的希望也是很渺茫。然后,你就不断搜索答案,一遍一遍的尝试错误的解决方案,到头来时间都浪费了,你将会感慨你虚度了一天,第二天你去问论坛的大神,问 QQ 群里的大牛,然而没有人“理你”,可能原创 2015-12-05 00:07:55 · 2087 阅读 · 1 评论 -
OpenLayers 3 之 扩展自定义控件--以切换图层控件为例
openlayers 中的控件,是一个固定在页面某个位置的可见的DOM元素,它们可能包含可操作的按钮,也可能只是单纯的展示信息,它们的位置及其样式是由与其关联的CSS样式决定的。默认情况下,它们都位于一个CSS 类(class)为`ol.overlaycontainer-stopevent`的元素内,当然也可以使用其他的自定义的DOM容器元素。原创 2015-12-21 08:47:34 · 10389 阅读 · 1 评论 -
OpenLayers 加载天地图
要使用 OpenLayers 3 加载天地图,首先要弄清楚天地图发布的原理,以及遵循的发布规范,上一篇中我们提到了使用 OpenLayers 3 加载百度地图,我们提到一般网络地图为了加快访问速度,都采用缓存切片地图的方式,天地图也不例外,而且原理极其类似,但是其切片的索引组织方式还是有一些不同,虽然都是切片,但是切片的起始坐标原点不一致,百度地图是屏幕的左下角,而天地图是屏幕的左上角(与谷歌地图一致)...原创 2015-11-09 21:23:39 · 28385 阅读 · 22 评论 -
OpenLayers 3 之 加载百度地图
很多人想使用 OpenLayers 调用百度地图、腾讯地图等国内地图,本文就讨论一下其可能性和实现原理。我们以百度地图为例,分析其地图调用原理,我们都使用过百度地图,在网速不快的情况下,肯定有过感受,地图是一块一块加载的,从这里我们就可以看出,地图是被切成了很多块的小图片,调用时按照一定规则请求需要的“切片”,可视区域以外的“切片”不加载,这样可以减小数据传输数据量,使地图加载更快。原创 2015-10-26 09:30:40 · 35100 阅读 · 8 评论 -
MapServer 之 发布网络要素服务(WFS-Web Feature Service)
上一篇关于 MapServer 的文章,我们主要配置了 MapServer 支持 WMS,这篇文章中我主要讲怎么配置 MapServer 支持 WFS(网络要素服务),WFS 是 Web Feature Service 的简写,也就是网络要素服务,提供地图数据要素一级数据 的服务,例如接受客户端请求要素、编辑要素和删除要素等于要素有关的操作的请求。原创 2015-12-03 10:51:02 · 5531 阅读 · 0 评论 -
MapServer 之 绘制地图图例
MapServer 渲染的地图中,颜色与种类的对应是用图例表示的,图例是多个符号与种类对应的图片,在 GIS 制作的专题图中图例很常见。如下图就是一个比较常见的图例,壁挂的中国地图中都会有,主要是标识作用。那我们在 MapServer 中怎么根据其渲染的地图,动态生成一个图例呢?这篇文章主要涉及这些内容。原创 2015-12-14 09:22:53 · 6845 阅读 · 0 评论 -
OpenLayers 3 之 切换图层控件
在 openlayers 2中,是默认有切换图层控件的,但是由于某种原因,openlayers 3中并没有默认实现,但却给我们很容易扩展的基类(ol.control.Control),我们可以自定义实现,并不是很难,这我会在其他文章中讲解。这篇文章中,我利用一个 GitHub 中的一个开源项目(这个项目就是扩展了`ol.control.Control`,自定义了切换图层控件),添加切换图层控件,并探索其用法。原创 2015-11-27 12:15:37 · 10605 阅读 · 4 评论 -
OpenLayers 3 之 事件体系详解
地图上的各种事件触发到底是怎么回事?熟悉前端的肯定知道 javascript 的事件机制,openlayers 既然是 javascript 实现的,那么它就也不例外,也遵循 W3C 的标准,只不过是 openlayers 进行的简化实现。文章首先讲解 openlayers 的事件结构实现,然后结合“切片WMS数据源”(ol.source.TileWMS)对象的事件机制进行实例分析。一. 介绍事件机原创 2016-05-04 09:19:12 · 23212 阅读 · 12 评论 -
OpenLayers 3 之 添加地图网格
在地图上渲染一层类似于经纬线的网格层,更有利于准确的确定区域,在WGS84坐标系下,以度,分,秒为单位,称之为“经纬网”,其网格是以经纬线来划分的。在OpenLayers3中,渲染网格的类是“ol.Graticule”。本文中,我结合实例,讲解“ol.Graticule”的用法和具体实现。原创 2016-06-02 13:34:06 · 16276 阅读 · 7 评论 -
GIS - 底图,怎么做怎么选择
底图往往是一些基础信息,比如行政区、街道、水系,它们变动较少,一般放在图层最下方。底图一般使用栅格瓦片,栅格瓦片有其自身局限性:地理信息内容改变,栅格瓦片无法做到实时更新。栅格瓦片需要预生成,生成以后不能改变,如果地理信息有变动,那么需要重新生成瓦片 样式改变,如果需要不同样式的底图,需要额外生成一份瓦片。不同样式,存储多份相同的数据。于是矢量瓦片的概念被提出,矢量瓦片也是瓦片,是矢量,在...原创 2019-04-27 18:38:38 · 3745 阅读 · 0 评论 -
PostgreSQL - 地理数据索引之争:GIST VS R-tree
目录GIST索引GiST原理R-tree索引R-tree原理 GiST VS R-tree创建时间支持的操作效率之争本文主要针对的是地理数据,地理数据的特点是具有二维或三维的坐标数据,且都是基于PostGIS扩展对地理数据的操作来说的。空间索引是空间数据库的关键所在,空间索引强,空间数据库支持大规模的数据才有意义,可以说空间索引的好坏决定了数据库的强弱。...原创 2019-02-01 22:09:49 · 5193 阅读 · 3 评论 -
PostgreSQL - 利用 citus 支持地理大数据
目录1. 实际问题可能的解决方案2. Citus是什么Citus的特点3. 建立集群3.1 让Coordinator知道有Worker的存在3.2 迁移数据4. 测试性能导入数据与数据分布缓冲区操作处理时间不涉及汇总的操作3. 总结1. 实际问题实际业务中,会有非常大的地理数据集的存储需求,比如全世界的点状POI,数据量级已达亿级别,存储在单...原创 2019-01-16 10:21:06 · 1811 阅读 · 0 评论 -
PostgreSQL - citus如何实现高可用,处理单点故障
目录1. worker节点故障1.1 PostgreSQL的流式复制1.2 Citus的分片复制2. Coordinator节点故障3. 总结号外:Citus发布了8.x版本,支持PostgreSQL11。Citus适合存放数据量较大的情形,不上亿的数据往Citus中存意义并不大,更适合放单节点。而存储如此大量的数据,如果不做好数据备份或者高可用,数据丢失产生的后果...原创 2019-01-15 20:01:30 · 3450 阅读 · 0 评论 -
Openlayers - 点聚集,全球地震点聚集为例
GitHub地址:https://github.com/QingyaFan/openlayers-examples1. 描述点聚集指在某个缩放级别下,将临近(一般用像素距离衡量)的点聚合为一个点要素显示,这在房屋中介的等的地图找房功能中很常见,如下图。但是这样的例子并不恰当,地图找房里的聚集确切的说并不是点聚集,他们是在每一级别显示某一级区块,然后在区块多边形的质心或者什么地方设置一个点要...原创 2018-09-15 12:07:59 · 3018 阅读 · 0 评论 -
OpenLayer3 之 实现拉框放大功能
几天前,有人给我发邮件询问如何实现划定一个矩形区域实现放大功能,即所谓的“拉框放大”,在 ol3 中,其实已有实现鼠标拖拽放大地图功能,默认需要配合 shift,按住shift,拖拽鼠标的同时,地图会放大,该组件名为 ol.interaction.DragZoom,该组件的缺点是不实用(哪一个非专业人员会想的按住shift拖动)。本文首先介绍该组件的实现,随后基于该组件,在地图上放置拉框按钮,实现一原创 2017-02-25 23:16:37 · 5783 阅读 · 4 评论 -
GIS 矢量切片(Vector Tile)-地图定制化的时代已经悄悄来临
前言 切片技术的简单介绍,以及传统栅格图片切片的不足现在最流行的地图底图技术是栅格切片底图,它们本质上是将空间数据分别渲染为不同缩放级别的地图图片,然后将各个级别的图片按照一定规则切分,按照一定的 “规则组织”,存储到硬盘或数据库中,构成一幅完整的地图。 图1 切片概念图相对于其他技术,切片地图有其优越性,例如有效减少了传输数据体积,多级缩放等。然而,栅格地图也有一些短处,缺乏实时性,数据完原创 2016-12-09 17:54:11 · 38622 阅读 · 40 评论 -
GIS 算法 之 拉默-道格拉斯-普克算法(ramer-douglas-peucker)
如今的 GIS 应用离不开互联网,即 “WebGIS”,GIS 一个显著的特点就是数据量大,数据异构,因此在网络中传输数据成为了影响 WebGIS 应用性能的瓶颈。在 Web 浏览器的应用中尤为明显,浏览器下载数据时,等待时间过长,会造成浏览器假死现象。如何减小数据量,用小的数据量做出类似的大数据量效果是一个值得研究的问题,纵观 WebGIS 的发展史,不难得出结论...原创 2016-11-25 13:58:31 · 13333 阅读 · 2 评论 -
OpenLayers3 在 Mac 视网膜屏下的响应式设计
PPI,DPI与window.devicePixelRatio在谈这个主题之前,首先得明确两个概念:DPI、PPI,首先他们都表示图片的分辨率,其次它们有不同:DPI,Dots Per Inch,表示每英寸有多少个点,是打印的术语;PPI,Pixel Per Inch,表示每英寸有多少个像素,是显示器的术语。对 ppi 的印象,我是从苹果发布视网膜屏幕的 iPhone4 开始的,原创 2016-10-27 23:23:39 · 2219 阅读 · 1 评论 -
OpenLayers 3 之 添加地图鼠标右键菜单
添加鼠标右键菜单,首先我们要监听鼠标右键点击的操作,我们知道鼠标右键事件名是 `contextmenu`,当鼠标在 html 元素之上,点击鼠标右键,便会触发 `contextmenu` 事件,在 `contextmenu` 事件的回调函数中实现相应的显示菜单功能即可。那么在 openlayers 中,在地图中添加这个事件,我们从哪里下手呢?首先我们得了解 openlayers 的初始化页面流程...原创 2015-12-29 09:32:35 · 9811 阅读 · 3 评论 -
OpenLayers 3 之 Overlay(覆盖物)详解
Overlay 从名字看,是覆盖图、覆盖物的意思,主要的用途就是在地图之上再覆盖一层,用以显示额外的可见元素,可见元素一般是 HTML 元素,利用 overlay,可以将可见元素放置到地图的任意位置,形成地图上再浮动一层的效果。例如在地图上相应的坐标放置一个标志,标签,利用 overlay 都可以做到,具体来说,点击地图上某位置,在点击位置弹出弹出框就是利用了 overlay。原创 2015-11-20 16:25:01 · 22616 阅读 · 4 评论 -
OpenLayers 3 之 地图矢量图层(ol.layer.Vector)详解
在 GIS 中,地图一般分为两大类:栅格地图和矢量地图,栅格地图其实就是数码照片,只不过有的是卫星拍的。它们有一个共同特征,就是它们都是由很多个像素组成,像素大小是一致的,行高和列宽是一致的,从这个角度看,一幅遥感影像就像栅格。 矢量地图,是由很多要素组成的,每个要素都有自己的地理坐标,基于数学规则,无论矢量地图怎么放大,地图都不会失真。它是 OpenLayers 中非常重要的一种图层类型原创 2015-06-07 07:50:22 · 20396 阅读 · 1 评论 -
OpenLayers 图层(Layers) 详解
如果不是专业的地图工作者,看到地图,可能觉得地图就是一张将三维世界映射到二维空间,很多信息混杂在一起表示空间信息的动态可交互图片,其实这只是表面现象。实际上地图是由一个或多个图层组成的,使用不同的图层存储不同类型的地物,比如由存储道路的图层,有展示拥堵情况的图层,通常还有一个含有基础地理信息(比如政区划分)的底图图层。原创 2015-04-30 18:41:55 · 80423 阅读 · 35 评论 -
OpenLayers 3 之 地图交互功能(interaction)详解
地图交互功能和上一篇讲的地图控件有些混淆,它们都控制着用户与地图的交互,区别是地图控件的触发都是一些可见的 HTML 元素触发,如按钮、链接等;而交互功能都是一些设备行为触发,都是不可见的,如鼠标双击、滚轮滑动等,手机设备的手指缩放等。 地图的交互功能包含很多,如地图双击放大,鼠标滚轮缩放,矢量要素点选,地图上绘制图形等等。只要是涉及到与地图的交互,就会涉及到 intercation ...原创 2015-05-21 09:07:28 · 31246 阅读 · 12 评论 -
OpenLayers 3 之 地图视图(View) 详解
初始化一幅地图,必备的三要素之一就是视图(view),这个对象主要是控制地图与人的交互,如进行缩放,调节分辨率、地图的旋转等控制。也就是说每个 map对象包含一个 view对象部分,用于控制与用户的交互。 主要介绍 view 的作用和用法,并分析商用的地图应用中的相关的功能。功能的具体的实现与如何进行定制和优化,就超过了这篇文章的范围了。原创 2015-05-09 18:21:34 · 38045 阅读 · 2 评论 -
OpenLayers 3 之 地图控件(control)详解
每一个地图应用都应该有一些工具方便用户控制地图的行为,比如缩放,全屏,坐标控件等等,在 OpenLayers 中怎么添加这些工具呢?下面我给大家介绍一下 OpenLayers 中包含的控件种类,并介绍其使用方法。对控件的定制化,和对 OpenLayers 增加控件和优化控件等超出了本文范围。原创 2015-05-14 08:43:25 · 22816 阅读 · 9 评论 -
OpenLayers 3 之 地图图层数据来源(ol.source)详解
source 是 Layer 的重要组成部分,表示图层的来源,也就是服务地址。除了在构造函数中制定外,可以使用 layer.setSource(source) 稍后指定。一、包含的类型ol.source.BingMaps ,必应地图的切片数据,继承自ol.source.TileImage;ol.source.Cluster,聚簇矢量数据,继承自ol.source.Vector;ol.sourc原创 2015-05-24 10:27:16 · 29940 阅读 · 3 评论 -
OpenLayers 3 之 地图样式(ol.style)详解
地图样式是由 style 类控制的,其包含了地图样式的方方面面,例如,填充色、图标样式、图片样式、规则图形样式、边界样式、文字样式等,样式一般针对矢量要素图层。 矢量图层样式可以事先写好,写成静态的,矢量图层直接按照定义好的样式渲染,也可以动态使用样式的 set() 方法,但是要注意刷新矢量图层,重新渲染,否则动态样式不生效。原创 2015-05-30 12:49:09 · 31556 阅读 · 13 评论 -
OpenLayers 3 简介
摘要主要聊聊OpenLayers是啥,咋用 !~-~ 还介绍了OpenLayers 3相对于以前的版本有啥改进不。 OpenLayers是干什么的?要想在浏览器中显示交互式的地图很难,因为浏览器默认的只是显示静态的图片,如PNG、JPEG等格式,要交互式很难,因为每一个点击和缩放,地图都要做出正确的反应。OpenLayers是一个JavaScript 类库包,主要是用于开发We原创 2015-03-12 09:52:12 · 6172 阅读 · 2 评论 -
浏览器定位原理与实现
获取用户位置,并进行个性化推荐,是一个位置应用非常重要的功能,也是目前 LBS 应用的基石。如果没有用户的位置,例如百度地图等应用就不能进行周边搜索,更不用说要持续跟踪用户位置的导航功能。目前使用浏览器获得设备地理位置,有两种方法:第一种是使用 JavaScript Geolocation API 直接编程获取;第二种是首先获取设备的 IP 地址,然后通过查询相应的 IP 与地理位置的数据库,得到用户的地理位置。原创 2015-04-16 09:14:15 · 8741 阅读 · 2 评论 -
ArcGIS 制作 “地图切片(tile)”
地图切片简介 地图切片,就是将一幅地图切成很多大小一致的小块,调用时候,只有需要的部分才会发送过去,节省带宽的同时,还节省了服务器端实时渲染地图的时间。但是地图切片有一个特点,就是不适合经常变动,或者说实时动态的数据,因为地图切片是地图服务器端事先渲染好的,而且制作地图切片是一个漫长的过程,可以说真的需要很长时间,但是用一次的耗费,换来性能的提升和节省多次渲染的时间是值得的。 切原创 2015-06-07 07:51:24 · 20485 阅读 · 6 评论 -
MapServer 之 发布网络地图服务(WMS-Web Map Service)
WMS(Web Map Service)从地理信息产生包含空间数据的地图,WMS将地图定义为适合在电脑屏幕上的数字图片,地图并不是数据本身,而是将原来的数据渲染成图片格式(PNG、GIF、JPEG)、基于矢量的元素SVG,或者WebCGM格式。MapServer发布WMS,是通过一个map格式的文件来定义WMS的访问路径;数据源的来源,包含数据库的和本地的文件;还包含一些WMS图层的样式,包含配色,线条粗细,是否用相原创 2015-06-15 09:23:59 · 16814 阅读 · 7 评论 -
OpenLayers 3 之 动态点扩散效果
当某个地方发生一些事情之后,如果我们添加一个静态点在地图上,并不能引起注意,那我们可以放置一个动态的点,类似于在水中投入一个石头,水波扩散的效果,象征发生的事件有一定的影响区域,那么,我们如何利用 OpenLayers3 做出这样的效果呢?我们要实现的效果如下图,之前雅安发生过地震,我们在雅安放置一个这样的点,表示雅安发生了地震。 如何实现呢?原创 2015-11-21 00:28:35 · 14694 阅读 · 8 评论 -
MapServer 之 发布 WMS GetFeatureInfo 服务
对于一张图片地图,如果想实现点击地图上一点,地图在相应位置弹出小窗口,显示所点区域的信息这样的功能。要首先获取鼠标点击的坐标,然后在数据库中判断该点在哪个要素的范围内,最后返回包含该点的要素信息。然而我们既然懂这个原理,就可以先看看有没有实现,没必要去重新造轮子。MapServer 就已经实现了该服务,因为这是 WMS 的 GetFeatureInfo 操作。原创 2015-11-16 08:54:43 · 4874 阅读 · 0 评论 -
OpenLayers 3 之 绘制图形(ol.interaction.Draw)详解
在地图上绘制各种各样的矢量图形,很多应用场景都需要用到,比如可以实现在客户端勾绘矢量图形并将结果保存到数据库以待后续编辑和可视化等等很多有用的功能。这次我们看看怎么利用 OpenLayers 3 绘制各种各样的图形,并添加到图层显示。在 OpenLayers 3 中负责绘制任务的是 ol.interaction.Draw 类,下面介绍这个类和功能的用法。原创 2015-09-21 09:57:25 · 38933 阅读 · 15 评论 -
OpenLayers 3 之 使用矢量图层(Vector)
摘要 矢量图层:矢量图层是用来渲染矢量数据的图层类型,在OpenLayers里,它是可以定制的,可以控制它的透明度,颜色,以及加载在上面的要素形状等。 常用于从数据库中请求数据,接受数据,并将接收的数据解析成图层上的信息。如将鼠标移动到中国,相应的区域会以红色高亮显示出来,高亮便是矢量图层的行为。主要内容1、 HTML文件的进化 这原创 2015-03-27 14:43:22 · 38144 阅读 · 17 评论 -
OpenLayers 3 之 使用 AJAX 通信
地图应用是大流量应用,如果频繁刷新页面,造成的数据传输也必然是很大的,这在你的网络不是很好的时候,你就醉了,这时候便是 AJAX 显现优势的时候了。这里我们把 AJAX 应用在地图搜索中,下面看看怎么做到的吧!原创 2015-04-08 14:29:10 · 10455 阅读 · 12 评论