自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

GIS地图技术分享(GIS入门、Openlayers教程、Leaflet教程),做最好的GIS地图开发教程

GIS地图技术分享(GIS入门、Openlayers教程、Leaflet教程),做最好的GIS地图开发教程

  • 博客(309)
  • 资源 (4)
  • 收藏
  • 关注

原创 Vue+OpenLayers7入门到实战目录,OpenLayers7中文文档,OpenLayers7中文手册,OpenLayers7中文教程,OpenLayers7文档pdf

本篇作为《Vue+OpenLayers7入门到实战》所有文章的二合一汇总目录,方便查找。本专栏源码是由OpenLayers7.x版本结合Vue框架编写。本专栏从Vue搭建脚手架到如何引入OpenLayers7依赖的每一步详细新手教程,再到通过各种入门案例和综合性的实战案例,带领大家快速上手Vue+OpenLayers7开发。

2024-03-04 17:31:33 1208 1

原创 Vue+OpenLayers6从入门到实战进阶案例汇总目录,Vue+OpenLayers6地图整合教程,OpenLayers6中文文档,OpenLayers6中文手册

本篇作为《Vue+OpenLayers入门教程》和《Vue+OpenLayers实战进阶案例》所有文章的二合一汇总目录,方便查找。> 本专栏源码是由OpenLayers结合Vue框架编写。> 本专栏从Vue搭建脚手架到如何引入OpenLayers依赖的每一步详细新手教程,再到通过各种入门案例和综合性的实战案例,带领大家快速上手Vue+OpenLayers开发。

2023-10-31 16:05:04 2193 4

原创 OpenLayers6扩展插件进阶之ol-ext使用:使用Notification控件来显示提示框,以鼠标点击位置经纬度弹出提示框为例

本章介绍OpenLayers扩展插件ol-ext的Notification控件来显示提示框,以鼠标点击位置经纬度弹出提示框为例。

2024-05-14 23:30:32 22

原创 OpenLayers6扩展插件进阶之ol-ext使用:使用FeatureList控件显示GeoJSONX数据列表并支持地图和列表联动

本章介绍OpenLayers扩展插件ol-ext的FeatureList控件来显示GeoJSONX数据列表并支持地图和列表联动的功能。# 依赖库使用npm安装依赖使用Yarn安装依赖。

2024-05-14 23:24:09 130

原创 Vue+OpenLayers7入门到实战:OpenLayers实现鼠标拖拽方式绘制矩形(正方形和长方形)

本章介绍如何使用OpenLayers7在地图上实现鼠标拖拽方式绘制矩形(拖拽方式长方形和正方形)。OpenLayers本身是可以通过鼠标点击多个点的方式来绘制多边形的,当然也包括长方形和正方形,但是这种多边形绘制出来的图形并不是准确的“长方形”和“正方形”,多多少少都会有一些变形(形状不规则),而且也不好控制。本章就是为了解决上述问题,只需要通过鼠标拖拽方式就可以直接实时生成形状规则的“矩形”。

2024-05-10 15:49:18 132

原创 Vue+OpenLayers7入门到实战:OpenLayers绘制四角形(菱形),OpenLayers绘制特殊图形

本章介绍如何使用OpenLayers7在地图上实现绘制特殊图形,以绘制四角形(菱形),OpenLayers绘制菱形的功能为例。本章核心代码不依赖任何第三方插件,只依赖OpenLayers。需要注意的是两个操作按钮需要引入ElementUI。

2024-05-10 15:46:06 297

原创 Vue+OpenLayers7入门到实战:OpenLayers如何加载百万级大数据量GeoJson点要素数据并叠加到webgl渲染图层上,百万海量点数据叠加不卡

在上一章中《OpenLayers如何加载GeoJson数据并叠加到OpenLayers矢量图层上》,我们讲解了少量数据加载并叠加到OpenLayers矢量图层上,但是如果加载的Feature要素数量特别多,浏览器就会很卡,所以需要用到webgl图层进行加载。本章讲解一下如何使用webgl图层叠加海量GeoJson点要素数据加载的功能。使用npm安装依赖使用Yarn安装依赖vue中如何使用OpenLaye

2024-05-09 14:24:51 218

原创 Vue+OpenLayers7入门到实战:OpenLayers解析通过fetch请求的GeoJson格式数据,并叠加要素文字标注,以行政区划边界为例

本章介绍如何使用OpenLayers7在地图上通过fetch请求geojson数据,然后通过OpenLayers解析为Feature要素叠加到图层上,并且通过动态设置标注方式显示要素属性为文字标注。

2024-05-09 14:20:41 235

原创 GIS入门,不使用任何第三方库,纯JavaScript实现Catmull-Rom样条曲线(Spline Curve)插值算法,生成更加平滑连续的曲线

样条曲线(Spline Curve)是一种通过给定的控制点插值生成平滑曲线的方法。其基本原理是通过控制点之间的插值来生成曲线,保证曲线的平滑性和连续性。通常情况下,样条曲线会经过每一个控制点,但并不受控制点的移动而发生剧烈变化,从而形成平滑的曲线。

2024-05-08 10:05:21 76

原创 GIS入门,不使用任何第三方库,纯JavaScript实现自定义多边形平滑曲线算法

我们使用Chaikin’s smoothing是一种基于迭代的曲线平滑方法,它通过重复的调整曲线上的点位置,以减少曲线的角度变化,从而使曲线变得更加平滑。初始化:将原始曲线的顶点作为初始点集合。迭代处理对于每条线段,根据设定的参数(通常是一个比例因子),将线段分成两部分,并在每个分割点处插入一个新的点。新插入的点的位置是原始线段的两个端点的某种线性组合,通常是按照一定的比例来确定。重复处理:重复执行迭代处理步骤,直到曲线的平滑度达到满意的程度或者达到了预先设定的迭代次数。

2024-05-08 09:48:55 77 2

原创 OpenLayers6实战,OpenLayers基于chaikin-smooth多边形平滑曲线算法库实现绘制平滑曲线

本章使用OpenLayers在地图上实现绘制曲线功能,基于chaikin-smooth多边形平滑曲线算法库来实现绘制平滑曲线。本章除了OpenLayers以外,还依赖chaikin-smooth库。《常用的多边形平滑曲线算法介绍和JavaScript的多边形平滑曲线算法库chaikin-smooth的实现原理》

2024-05-07 23:32:53 140

原创 GIS入门,常用的多边形平滑曲线算法介绍和JavaScript的多边形平滑曲线算法库chaikin-smooth的实现原理和使用

是一个基于 Chaikin’s algorithm 的曲线平滑处理技术的js库。基于多边形平滑曲线算法,通过迭代地调整曲线上的点位置,使得曲线更加平滑,减少曲线的角度变化,从而改善曲线的视觉效果。在中,通常会指定一个迭代次数或者一个平滑程度参数,来控制平滑处理的程度。通过多次迭代,曲线上的点逐渐向原始曲线的局部中心移动,从而使得曲线变得更加平滑。这种方法的优点是简单易实现,并且可以在较少的迭代次数内产生较好的平滑效果。

2024-05-07 15:46:47 233 1

原创 Vue+OpenLayers7入门到实战系列-交流专区,建议和问题反馈

OpenLayers7.x新版本更多是性能上的优化,兼容性方面不如6.x版本,如果没有特别需要,可以继续观看6.x版本教程即可现有满足地图开发需求。可以问一些GIS领域问题,也可以谈谈自己对GIS行业的看法,以及提一些关于本专栏的建议等等(其他内容也可以欢迎讨论)。专栏咨询可以添加博主微信公众号:eguid(请备注已订阅专栏的用户id或订单号,其他情况概不回复)2、博主会不定期更新一些内容或者消息在这里(目录的话一般会跟随文章更新一同更新)。1、就是为了方便大家沟通交流,大家可以在本文评论区留言。

2024-04-26 16:07:12 24 1

原创 Vue+OpenLayers7入门到实战:OpenLayers加载GeoJson格式数据并解析成多边形、线段、点和区域范围等要素叠加到地图矢量图层上

本章介绍如何使用OpenLayers7在地图上加载GeoJson格式数据并解析成多边形、线段、点和区域范围等要素叠加到地图矢量图层上的功能。前面两章也是可以支持多边形、线段、点和区域范围灯数据加载的,只是没有设置样式,所以只能看到点,本章就相当于完整版本,可以将所有图形都详细展示出来。

2024-04-25 14:05:31 453

原创 Vue+OpenLayers7入门到实战:OpenLayers从vue的assets资源路径加载geojson文件并解析数据叠加到地图上,以加载世界各国边界为例

本章介绍如何使用OpenLayers7在地图上加载世界各国边界的GeoJSON格式数据为例,讲解如何使用OpenLayers6从vue的assets资源路径加载geojson文件并解析数据叠加到地图上。

2024-04-25 14:02:49 239

原创 Vue+OpenLayers7入门到实战,OpenLayers加载GeoJson数据并叠加GeoJson中的要素到地图上

本章介绍如何使用OpenLayers7在地图上加载GeoJson数据并叠加GeoJson中的要素到OpenLayers矢量图层上。GeoJson数据格式可以参考博主另一篇文章《GIS开发入门,GeoJSON是什么?GeoJSON格式标准介绍》,那么废话少谈,让我们立刻开始加载GeoJson数据并叠加要素到地图上。

2024-04-23 16:53:13 134

原创 适合GIS专业学生和前端webgis小白快速上手的Vue+OpenLayers6入门到实战教程,OpenLayers6中文文档手册

Gis开发入门,OpenLayers、Leaflet、Maplibre-gl和Cesiumjs地图引擎介绍以及几种地图服务vms、vmts介绍OpenLayers介绍,相比较其他地图引擎有什么优点OpenLayers7.x版本和6.x版本有什么区别,是否需要升级到OpenLayers7版本?OpenLayers6实战:OpenLayers创建自定义控件,以创建一个地图复位控件为例OpenLayers6实战,OpenLayers创建自定义鹰眼控件,自定义鹰眼控件样式,调整鹰眼控件位置、大小、文字和按钮等样式。

2024-04-23 10:23:35 1010

原创 OpenLayers6实战,OpenLayers鼠标拖拽方式绘制半圆环形(半圆扇形)

本章讲解如何使用OpenLayers特殊图形绘制,通过鼠标拖拽方式来绘制出半圆环形(半圆扇形)的功能,效果像磁铁一样的半圆弧。上一章中我们以及实现了四分之一圆环形的特殊图形绘制《OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制环形(四分之一圆环),OpenLayers特殊图形绘制》,本章在上一章章基础上修改而成。

2024-04-22 17:05:42 163

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制环形(四分之一圆环),OpenLayers特殊图形绘制

本章讲解如何使用OpenLayers在地图上实现鼠标拖拽方式绘制环形(四分之一圆环)的功能。

2024-04-22 16:25:11 145

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制空心圆环

本章讲解OpenLayers特殊图形绘制,也即使用OpenLayers实现鼠标拖拽方式绘制空心圆环的功能。

2024-04-19 17:06:40 437

原创 OpenLayers9.1.0版本正式发布,OpenLayers9.1.0值得升级吗?9.1.0版相比9.0.0版本又更新了哪些内容?OpenLayers9相较于OpenLayers8更新了哪些内容?

OpenLayers9.1.0版本正式发布,,最近OpenLayers大版本迭代很快,但是几乎没有什么重大的功能更新。比如这次的OpenLayers9.1.0几乎都是修修补补,没有功能更改和升级。

2024-04-19 14:42:53 889

原创 Vue+OpenLayers7入门到实战:OpenLayers加载wkt格式数据,OpenLayers解析wkt格式的要素数据并渲染到地图上

本章介绍如何使用OpenLayers7在地图上加载并解析wkt格式数据,以及渲染wkt格式的要素数据到地图上的功能。使用Point(点)、(LINESTRING)线,和(POLYGON)多变形的wkt数据进行演示。wkt介绍请参考博主另一篇文章《GIS入门,WKT格式详解》

2024-04-17 22:02:03 157

原创 Vue+OpenLayers7入门专栏目录,OpenLayers7中文文档,OpenLayers7中文手册api,OpenLayers7中文教程

本篇作为《Vue+OpenLayers7入门教程》所有文章的二合一汇总目录,方便查找。本专栏源码是由OpenLayers7.x版本结合Vue框架编写。本专栏基本上每章都有详细的源代码和运行示例以供参考,且保证每章代码都可以正常运行,非常适合入门读者从零开始学习。本专栏从Vue搭建脚手架到如何引入OpenLayers7依赖的每一步详细新手教程,再到通过各种简单的入门案例带领大家快速上手Vue+OpenLayers7开发。

2024-04-17 21:26:58 438

原创 Vue+OpenLayers7入门到实战:OpenLayers计算matrixIds和resolutions方式加载WMTS地图服务,不需要解析WMTSCapabilities文档方式加载WMTS

本章介绍如何使用OpenLayers7在地图上实现通过计算matrixIds和resolutions方式加载WMTS地图服务,不需要解析WMTSCapabilities文档方式加载WMTS地图服务的功能。在本章之前,已经写过《Vue+OpenLayers7入门到实战:OpenLayers通过WMTSCapabilities.xml加载GeoServer发布的标准wmts地图服务。

2024-04-16 10:02:37 148

原创 Vue+OpenLayers7入门到实战:OpenLayers通过WMTSCapabilities.xml加载GeoServer发布的标准wmts地图服务

本章介绍如何使用OpenLayers7在地图上实现通过WMTSCapabilities.xml加载GeoServer发布的标准wmts地图服务的功能。1、什么是wmts(Web地图平铺服务)?OGC Web Map Tile Service实施标准 (WMTS)定义一组接口,用于使用具有预定义内容、范围和分辨率的分幅图像对空间参考数据的地图分幅进行基于web的请求。本标准包括WMTS规范(“WMTS规范”)以及附带文档,如概要文件和XML文档。

2024-04-16 09:58:06 141

原创 GIS入门,Java不使用任何第三方库实现射线穿越法计算某个点是否与多边形相交,比普通射线法提升了计算性能

在上一章中《GIS入门,Java不使用任何第三方库实现判断一个经纬度点是否在多个经纬度点组成的多边形内,计算某个点是否与多边形相交》,我们使用了一个最简单的算法“射线法”来计算一个点到是否与多边形相交,但是对于多边形非常多的顶点时,计算就会力有不逮。(Ray Crossing Algorithm)或(Ray Casting Algorithm)来更快的计算某个点是否与多边形相交。

2024-04-15 17:39:58 68 1

原创 GIS入门,Java不使用任何第三方库实现判断一个经纬度点是否在多个经纬度点组成的多边形内,计算某个点是否与多边形相交

本章记录Java实现“射线法”判断一个经纬度点是否在多个经纬度点组成的多边形内的算法,也就是检查某个经纬度点是否与该多边形相交。

2024-04-15 17:30:27 173

原创 OpenLayers6特殊图形绘制教程目录汇总文档,使用OpenLayers画点、线、曲线、多边形、圆形、半圆、椭圆、圆环、环形扇形、三角形、矩形、平行四边形、梯形、菱形、五角星、六角形和箭头等

本章用于汇总OpenLayers地图中各种特殊图形绘制系列汇总目录。内容包含:点、线、多边形、圆形、半圆、四分之一圆、椭圆、圆环、半圆环、环形扇形、三角形、矩形、正方形、长方形、平行四边形、梯形、菱形、五角星、六角形(六芒星)以及箭头等等特殊图形。

2024-04-12 14:29:08 125

原创 OpenLayers6实战,OpenLayers鼠标拖拽方式绘制半圆形(半圆扇形)

本章讲解使用OpenLayers在地图上实现鼠标拖拽方式绘制半圆形(半圆扇形)

2024-04-12 14:12:11 221

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制椭圆

本周讲解使用OpenLayers在地图上实现鼠标拖拽方式绘制椭圆的功能。

2024-04-12 14:07:38 430

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制矩形(拖拽方式绘制长方形和正方形)

本章介绍使用OpenLayers在地图上实现鼠标拖拽方式绘制矩形(拖拽方式长方形和正方形)。OpenLayers本身是可以通过鼠标点击多个点的方式来绘制多边形的,当然也包括长方形和正方形,但是这种多边形绘制出来的图形并不是准确的“长方形”和“正方形”,多多少少都会有一些变形(形状不规则),而且也不好控制。本章就是为了解决上述问题,只需要通过鼠标拖拽方式就可以直接实时生成形状规则的“矩形”。

2024-04-11 17:41:16 161

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制平行四边形

本章介绍如何使用OpenLayers在地图上使用实现鼠标拖拽方式绘制平行四边形。

2024-04-11 17:33:39 143

原创 Vue+OpenLayers7入门到实战:OpenLayers加载WFS服务的要素资源数据并叠加到地图上

本章讲解如何使用OpenLayers6加载WFS服务的要素资源数据并叠加到地图上的功能。WFS是基于地理要素级别的数据共享和数据操作,WFS规范定义了若干基于地理要素(Feature)级别的数据操作接口,并以 HTTP 作为分布式计算平台。通过 WFS服务,客户端可以得到矢量数据格式描述的单个地理要素的空间数据或要素集的空间数据,并可以对单个地理要素进行编辑、 删除、 添加等数据操作。WFS采用 GML描述地理要素特征, 根据用户请求的内容返回 GML描述的空间数据。

2024-04-08 19:22:31 57

原创 Vue+OpenLayers7入门到实战:OpenLayers实现地图原地旋转动画效果

本章介绍如何使用OpenLayers7在地图上实现地图原地旋转动画效果。

2024-04-08 19:17:21 149

原创 Vue+OpenLayers7入门到实战:OpenLayers实现鼠标拖拽方式绘制三角形,OpenLayers鼠标拖拽方式自定义绘制特殊图形

本章介绍如何使用OpenLayers7在地图上实现鼠标拖拽方式绘制三角形,OpenLayers鼠标拖拽方式自定义绘制特殊图形的功能。OpenLayers本身是可以通过多边形绘制来绘制自行绘制三角形的,但是这种绘制方式是通过鼠标点击每个点来实现线条链接的,不支持固定的三角形这种特殊图形绘制的。因此本章我们通过自定义OpenLayers的绘制事件,来让OpenLayers支持鼠标拖拽方式绘制三角形,让绘制三角形变得更加方便。

2024-04-07 15:09:29 129

原创 Vue+OpenLayers7入门到实战:OpenLayers如何销毁已经创建好的地图容器

本章介绍如何使用OpenLayers7在地图上如何销毁已经创建好的地图容器。在某些场景下,可能会需要销毁之前的地图,重新创建新的地图的需要,因此本章介绍一下在开始创建地图前如何先销毁之前的地图的功能。

2024-04-07 15:03:42 433

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制梯形

本章讲解如何使用OpenLayers实现鼠标拖拽方式绘制梯形。点击鼠标拖拽梯形,松开鼠标后绘制完成。

2024-04-03 17:32:12 140

原创 GIS入门,EPSG:3857介绍,纯JS如何实现简化得Web墨卡托投影的逆变换和高精度Web墨卡托投影逆变换转换EPSG:3857坐标成EPSG:4326坐标

EPSG:3857坐标系,也称为(Web Mercator projection),是一种用于Web地图的常见投影系统。它是由谷歌地图在2005年引入并广泛采用的。这个投影系统将地球表面的经纬度坐标转换为平面坐标,使得地图在Web上的显示更加方便和流畅。坐标系使用的是(Mercator projection),它将地球表面投影到一个平面上,以保持经线和纬线之间的角度不变。这意味着在墨卡托投影下,经线和纬线都是直线,而且纬度越高的地方,投影后的坐标值越大。尽管。

2024-04-03 09:58:29 244

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽绘制三角形,OpenLayers自定义绘制特殊图形

本章讲解使用OpenLayers如何绘制三角形。OpenLayers本身是可以通过多边形绘制来绘制自行绘制三角形的,但是这种绘制方式是通过鼠标点击每个点来实现线条链接的,不支持固定的三角形这种特殊图形绘制的。因此本章我们通过自定义OpenLayers的绘制事件,来让OpenLayers支持鼠标拖拽方式绘制三角形,让绘制三角形变得更加方便。

2024-04-02 11:25:42 180

原创 OpenLayers6实战,OpenLayers实现鼠标拖拽方式绘制扇形,OpenLayers绘制特殊殊图形四分之一圆

本章讲解使用OpenLayers实现绘制扇形,绘制特殊殊图形扇形(也即:四分之一圆)的功能。本章代码是在绘制圆形的基础上扩展修改而成:圆形绘制可以参考:《OpenLayers6入门,OpenLayers图形绘制功能,OpenLayers实现在地图上绘制线段、圆形和多边形。

2024-04-02 11:06:53 376

JT-T415-2006 道路运输电子政务平台 编目编码规则.pdf

JT-T415-2006 道路运输电子政务平台 编目编码规则.pdf --JTT809附属文档

2017-05-08

JTT 809-2011 道路运输车辆卫星定位系统--平台数据交换.pdf

《JTT 809-2011 道路运输车辆卫星定位系统--平台数据交换》交通厅官方协议规范说明文档完整版

2017-05-08

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除