随笔分类 - openlayer/geoserver
开源2DGIS
摘要:我的简介: 来自于广东茂名,西南大学gis专业毕业。从毕业至今,已经七年多,在这七年多的时间里,一直在从事着跟gis相关的工作,专注webgis开发领域。总结一下自己的工作涉及领域包括以下几个部分: (1)gis地图数据处理:arcgis以及qgis桌面软件,导入处理gis地图数据,数据源主要是sh
阅读全文
摘要:大概实现思路如下:
1.创建矢量图层;
2.设置矢量图层样式,以样式组形式;
3.矢量图层样式组底层保持不变,改变矢量图层的要素feature属性值,动态更新顶层样式的线间隔lineDashOffset属性值,达到线水流动效果。
关键点:矢量图层的样式style内部更新渲染机制,在图层可见范围,地图缩放会自动触发;矢量图层的要素设置属性值变化的话,也会触发。
阅读全文
摘要:内容概览:openlayers6地图截图导出功能;源代码demo下载
阅读全文
摘要:openlayers6结合echarts4实现迁徙图
阅读全文
摘要:之前写过一篇openlayers4版本的地图切换效果,但是由于是封装一层 js代码写的,很多初学者看起来比较有点吃力,所以本篇文章重新写一篇地图切换效果,直接基于最新版本openlayers6写的,纯粹html + js + css形式,没有任何封装。
阅读全文
摘要:大概实现思路如下:读取聚合图模拟数据源json,构造openlayers聚合图数据源features,然后创建聚合图图层(核心数据源类Cluster),设置Cluster的初始化一些参数值,参数详细说明自行看openlayers官网文档api。
阅读全文
摘要:大概实现思路如下:读取热力图模拟数据源json,构造openlayers热力图数据源features,然后创建热力图图层(核心类Heatmap),设置Heatmap的初始化一些参数值,比如weight权重值,radius,gradient,blur等等,参数详细说明自行看openlayers官网文档apiHeatmap;创建好热力图图层之后,radius值我这里不是固定写死,是通过监听地图缩放事件动态设置radius不同大小的,个人纯粹觉的为了让热力图渲染更看好一点,别无他意。
阅读全文
摘要:之前写过一篇openlayers4版本的地图绘制扇形文章,但是由于是封装一层 js代码写的,很多初学者看起来比较有点吃力,所以本篇文章重新写一篇地图绘制扇形文章,直接基于最新版本openlayers6写的,纯粹html + js + css形式,没有任何封装。
阅读全文
摘要:本篇主要是参照openlayers6结合geoserver利用WFS服务实现图层新增功能(附源码下载)基础上实现的,openlayers6通过调用geoserver发布的地图服务WFS来达到图层编辑记录的目的。与GeoServer的WFS进行基于Rest交互关键就在于请求参数,值得注意的是这些请求最好采用POST方法发送。查询可以采用json,但增加,删除,修改都只能采用XML形式Transaction
阅读全文
摘要:本篇主要是在上一篇openlayers6结合geoserver利用WFS服务实现图层新增功能(附源码下载)基础上实现的,openlayers6通过调用geoserver发布的地图服务WFS来达到图层删除记录的目的。与GeoServer的WFS进行基于Rest交互关键就在于请求参数,值得注意的是这些请求最好采用POST方法发送。查询可以采用json,但增加,删除,修改都只能采用XML形式Transaction
阅读全文
摘要:本篇主要是openlayers6通过调用geoserver发布的地图服务WFS来达到图层新增记录的目的。与GeoServer的WFS进行基于Rest交互关键就在于请求参数,值得注意的是这些请求最好采用POST方法发送。查询可以采用json,但增加,删除,修改都只能采用XML形式Transaction
阅读全文
摘要:本文我是参照openlayers官网webgl点渲染例子,替换自己的数据源做的测试渲染例子,测试点图层77w左右个点,渲染效果还可以,体验问题不大。
阅读全文
摘要:实现思路:利用Geoserver发布矢量切片服务,然后openlayers调用矢量瓦片服务渲染加载,geoserver发布矢量服务步骤自行百度搜索相关教程,网上很多。最后,通过地图点击事件交互,实现图形高亮以及气泡窗口显示信息详情效果。
阅读全文
摘要:之前写过一篇 openlayers4 版本的地图空间查询文章,但是由于是封装一层 js 代码写的,很多初学者看起来比较有点吃力,所以本篇文章重新写一篇地图空间查询文章,直接基于最新版本 openlayers6 写的,纯粹 html + js + css形式,没有任何封装。
阅读全文
摘要:之前写过一篇 openlayers4 版本的地图属性查询文章,但是由于是封装一层 js 代码写的,很多初学者看起来比较有点吃力,所以本篇文章重新写一篇地图属性查询文章,直接基于最新版本 openlayers6 写的,纯粹 html + js + css形式,没有任何封装。
阅读全文
摘要:内容概览
1.基于 openlayers4 结合 echarts4 交通线流动图
2.源代码 demo 下载
阅读全文
摘要:内容概览
1.基于 openlayers4 结合 echarts4 实现统计图
2.源代码 demo 下载
阅读全文
摘要:内容概览
openlayers5 结合 echarts4 实现散点图
源代码 demo 下载
阅读全文
摘要:内容概览
1.基于 openlayers4 结合 echarts4 实现散点图
2.源代码 demo 下载
阅读全文
摘要:内容概览:1.openlayers5 结合 turf.js 实现等值线;2.源代码 demo 下载
阅读全文