- 博客(43)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 CesiumJS 1.85 升级错误处理
错误原因分析由于在 ./node_modules/cesium/Source/ThirdParty/zip.js 文件中使用了 import.meta 语法，webpack 默认不支持，在进行项目构建时，会报如下错误，提示信息需要添加 loader。解决1、安装loadernpm install @open-wc/webpack-import-meta-loader --save-dev2、webpack配置module: { rules: [ { test: /\
2021-09-13 15:13:07
2128
6
原创 TopoJSON格式规范说明
TopoJSON 是 GeoJSON 的扩展， 增加了拓扑逻辑的编码。目录1.简介1.1.举例1.1.1 example 11.1.2 example 21.2.定义2.TopoJSON 对象2.1 拓扑对象 （Topology）2.1.1.位置（Positions）2.1.2 转换（Transforms）2.1.3 弧（Arcs）2.1.4 弧索引（Arc Indexes）2.1.5 对象（Objects）2.2 几何对象（Geometry Objects）2.2.1 点（Point）2.2.2 多.
2021-03-23 17:16:54
2007
转载 GeoJSON格式规范说明
GeoJSON 是基于 JavaScript 对象表示法的地理空间信息数据交换格式。目录1.简介1.1.举例1.2.定义2.GeoJSON 对象2.1 几何对象2.1.1.位置2.1.2.点2.1.3.多点2.1.4.线2.1.5.多线2.1.6.面2.1.7.多面2.1.8.几何集合2.2.特征对象2.3.特征集合对象3.坐标参考系统对象3.1. 名字 CRS3.2. 连接 CRS3.2.1.连接对象4.边界框附录 A.集合例子点线面多点多线多面几何集合1.简介GeoJSON 是一种对各种地理数.
2021-03-23 14:18:19
595
转载 arcgis制图 ——羽化效果
0 先堵为快1 思路1）在ArcMap中，对于重点突出区域生成多环缓冲区，2）使用Union工具，给多环缓冲区加一个边界，该边界范围与地图出图范围一致3）对缓冲区的多边形使用由小到大的透明度，使用白色填充符号2 步骤第一步：创建多环缓冲区。根据研究区域边界，可以使用ArcToolbox中分析工具箱里的Multiple Ring Buffer tool工具创建多环缓冲区，也可以使用Buffer向导。1）计算羽化的范围（30km）2、开启Buffer Wizard工具。单击菜单Cu
2021-02-26 15:59:22
2814
原创 前端TIps —通过正则表达解析css的font参数
1、css fontfont 属性可以用来作为 font-style, font-variant, font-weight, font-size, line-height 和 font-family 属性的简写，或将元素的字体设置为系统字体。font: 1.2em "Fira Sans", sans-serif;font: italic 1.2em "Fira Sans", serif;font: italic small-caps bold 16px/2 cursive;font: small-
2021-02-22 16:35:05
414
原创 解读坐标系定义之：proj4
proj4 命令proj -l 获取所有的坐标系proj -ld 获取所有的基准面proj -le 获取所有的椭球体proj -lu 获取所有的单位cs2cs -lm 获取所有的中央子午线文章目录一、proj-strings0、参数列表1、+axis1.1 组合值1.2 +axis常用值2、+ellps 椭球体3、+datum 基准面3、+pm （prime meridian）中央子午线4、+proj 坐标系5、+units 、+vunits 单位6、+x_0 、+y_0 偏移量二、常用.
2021-01-27 16:10:56
5875
2
原创 Openlayers源码阅读（八）：要素Feature渲染过程
上一篇中，主要理清了图层Layer的渲染方式， 其中，以IntermediateCanvas的图片渲染方式主要采用context.drawImage()的方式实现，而VectorLayer的渲染则不同，本文将进一步说明。导图#mermaid-svg-qXwcNzTvJDDzFzqx .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}.
2020-12-25 18:22:20
1798
原创 JavaScript 常用的拷贝方式
目录一、知识前提1、数据类型：2、赋值、浅拷贝与深拷贝的区别二、Object 的拷贝2.1、Object.assign(obj) —— 浅拷贝2.2、{...obj} —— 浅拷贝2.3、JSON.parse(JSON.stringify(obj)) —— 深拷贝三、Array的拷贝3.1、array.slice() —— 浅拷贝3.2、array.concat() —— 浅拷贝3.3、[...array] —— 浅拷贝3.4、JSON.parse(JSON.stringify(array)) —— 深拷贝
2020-09-11 17:12:31
317
原创 Openlayers源码阅读（七）：图层canvas渲染
上一篇中，ol.renderer.canvas.Map在renderFrame()中通过getLayerRenderer()初始化ol.renderer.canvas.Layer，并调用了ol.renderer.canvas.Layer的prepareFrame()、composeFrame方法。文章目录导图一、ol.renderer.canvas.Layer二、ol.renderer.ca...
2020-03-21 20:28:50
3035
原创 openlayers源码阅读（六）：渲染从Map说起
openlayers源码阅读（六）：渲染从Map说起前面几篇主要是从地图服务的使用角度，去阅读了图层数据源相关的源码。便于我们去很好的理解OGC的WMS、WMTS、WFS等地图服务标准及调用，以及针对ArcGIS Server 发布的服务和OSM、bing等使用。而接下来的几篇，会从渲染的角度去阅读源码，更好地理解从数据到图的过程。一、地图初始化<div id = 'map'>...
2020-03-20 20:06:08
1614
原创 OpenLayers源码阅读（四）：TileImage及TileArcGISRest、XYZ、WMTS
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...
2019-12-20 21:06:36
4364
原创 ol调用arcgis server地图服务的query查询
目录一、返回的数据类型二、属性查询1、全部查询2、属性字段查询三、空间查询1、根据query结果查询2、点查询3、线查询4、面查询四、补充1、spatialRel2、geometryType以arcgis 提供的地图服务为例 http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Cens...
2019-11-21 20:21:38
5582
1
原创 ol遇见OGC系列——WFS
一、WFS的概念Web Feature Service（网络要素服务），简称WFS。支持对OpenGIS简单要素的数据编辑操作（插入，更新，删除，检索），实现服务器端和客户端之间的要素交互。主要有GetCapabilities，DescribeFeatureType、GetFeature服务操作：GetCapabilities：获取用于查询WFS服务的相关信息，包括支持的操作、支持的格式、...
2019-10-13 23:53:27
1385
原创 geoserver 安装
本文主要是在windows的环境下环境，其他环境请查看官方帮助文档一、下载geoserver下载地址：https://sourceforge.net/projects/geoserver/files/GeoServer/2.15.0/ （推荐）或者 http://geoserver.org/download/下载程序：geoserver-2.15.0.exe、geoserver-2.1...
2019-04-14 15:10:56
813
原创 geoserver 跨域解决方案
geoserver 默认是不允许跨域的，因此需要进行跨域设置方法一：修改geoserver的相关设置。（以geoserver 2.13.2为例）步骤一： 修改web.xml配置在webapps/geoserver/WEB-INF/web.xml中，<!-- Uncomment following filter to enable CORS --><!-- <f...
2019-04-14 13:50:49
1313
原创 openlayers中比例尺的计算原理
3、点分辨率4 屏幕初始化：中心点 、空间分辨率5 屏幕上1像素代表的实际距离是多少？在计算瓦片的行列号之前，我们需要得到图上一像素代表实际距离多少米。现在假设地图的坐标单位是米，dpi为96 ；1英寸=2.54厘米；1英寸=96像素；最终换算的单位是米；如果当前地图比例尺为1:125000000，则代表图上1米等于实地125000000米；米和像素间的换算公式：1英寸=0.02...
2018-12-01 01:38:51
4468
3
原创 利用Turf.js实现点线面几何体的拓扑关系判断
通过官网http://turfjs.org/或者github https://github.com/Turfjs/turf了解第一步：先引用js文件<script src='https://npmcdn.com/@turf/turf/turf.min.js'></script>第二步：调用函数,判断关系booleanClockwise(line) //线是否...
2018-11-16 19:01:45
15600
6
原创 js实现全屏和退出全屏功能
主要是全屏和退出全屏事件，以及相应的操作（采用window.onresize监测）$(function(){ //全屏 $("#fullScreen").on("click",function(){ fullScreen(); }) //退出全屏 $("#exitFullScreen").on("click&am
2018-11-13 20:24:03
32541
5
原创 Bug：比例尺（ScaleLine）在Openlayers v4.6.5中计算错误
该bug，官方已经在后续版本修正，故只针对OL 4.6+。在此自做记录。场景：1、引用Openlayers v4.6.5的js文件2、view的坐标系采用EPSG:43263、比例尺的单位为米（metric）原因分析：在源码scaleline.js中，......ol.control.ScaleLine.prototype.updateElement_ = function()...
2018-11-01 14:53:31
1766
翻译 Tip:Write Better Conditionals in JavaScript
条件语句1、if……else……2、 if……else if……3、switch……case……文章来源于https://scotch.io/bar-talk/5-tips-to-write-better-conditionals-in-javascript1. 对多个条件使用Array.includes// conditionfunction test(char) { ...
2018-10-26 18:59:26
195
原创 图片文字居中
1、标签a中图片文字居中&amp;lt;a&amp;gt;&amp;lt;img src=&quot;images/icon-position.png&quot; /&amp;gt;定位&amp;lt;/a&amp;gt;//css样式&amp;lt;style&amp;gt;a{ line-height: 20px;
2018-10-11 20:32:22
1352
转载 Object数据转化为Map对象
使用request的getParameterMap()，将前段ajax传递的Object数据转化为Map对象import java.util.HashMap;import java.util.Iterator;import java.util.Map;import java.util.Map.Entry;import javax.servlet.http.HttpServletRequ...
2018-10-11 20:31:14
8864
原创 当ol.source.Cluster遇到map.forEachFeatureAtPixel时
一、知识储备1、vector layer的添加，请参考openlayers的vector-layer.html，http://openlayers.org/en/latest/examples/vector-layer.html?q=vector2、map.forEachFeatureAtPixel方法3、cluster Feature，请参考openlayers的cluster.html...
2018-10-11 20:14:33
6672
1
转载 css构建shape
文章目录squarerectanglecircleovaltriangle-uptriangle-downtriangle-lefttriangle-toplefttriangle-toprighttriangle-bottomlefttriangle-bottomrightcurvedarrowtrapezoidparallelogramstar-sixstar-fivepentagonhex...
2018-10-09 20:36:26
244
原创 CSS：margin遇上inline，各浏览器的反映
1、inline元素默认垂直对齐方式为以父元素的baseline，但是展示时又是以bottomline为对齐方式，因此造成了元素之间的间隙。2、例子 <div style="position: fixed; top: 10px; right: 10px; "> <img width="60px" height="60px" src="1.png" styl...
2018-09-26 18:55:36
1055
原创 面向对象之JavaScript
文章目录1、 何为对象2、 创建对象2.1 常用、简单、基本的创建方式2.2 构造函数创建2.3 原型创建2.4 构造函数、原型混合创建3、 对象的继承3.1 原型链继承3.2 借用构造函数继承3.3 组合继承3.4 原型式继承3.5 寄生式继承1、 何为对象2、 创建对象2.1 常用、简单、基本的创建方式2.2 构造函数创建2.3 原型创建2.4 构造函数、原型混合创建3、 对象的...
2018-09-25 20:20:09
159
原创 OpenLayers源码阅读（三）：ImageWMS及ImageArcGISRest
前提：需要理解常见的地图服务WMS、WMTS、WFS等，针对本文，主要理解WMS服务及其GetCapabilities、GetMap、GetFeatureInfo操作即可。说明：本文重点关注ol.source.Image部分1、我们如何使用（官网例子http://openlayers.org/en/v4.6.5/examples/wms-image.html?q=wms）...
2018-09-13 14:06:15
4306
原创 瓦片检索小项目总结
1、项目框架 前端框架：Openlayers 后台框架：SpringMVC 其他技术：WebSocket、并发 2、瓦片 坐标系（EPSG:3857，EPSG:4326，EPSG:4490） 原点 origin(均范围为左上角) 墨卡托： [-20037508.342789244, 20037508....
2018-09-06 19:24:06
592
原创 点线面拓扑关系
一、基础知识1.1 点线面的关系主要有六大关系：点点关系、点线关系、点面关系、线线关系、线面关系、面面关系 点 线 面 点 点/点 线 点/线 线/线 面 点/面 线/面 面/面1.2 点线面的内部、边界、外部I为内部（紫色部分）、B为边界（紫色部分）、E为外部（黑色部分） ...
2018-08-31 18:53:21
15084
原创 OpenLayers源码阅读（二）：体系结构
回顾上讲，ol以初始属性定义、对象继承等方法的定义实现开始。因此，在阅读后续源码的之前，需要对ol中所涉及到的对象有一个整体上的把握。1、从ol.Object开始，向上、向下追溯，则构成了如下图的网络图 其中，Map(父类PluggableMap)、View、Layer、Overlay、Source、Geometry、Feature、Control等继承于Object图层...
2018-08-28 20:06:01
2697
原创 继承、抽象、接口、多态、封装
画了一个简易的关系图（个人总结）。 通过这个关系图，可以得到以下信息： 继承（extends/implements）：类，单一继承，classs A extends class B，class B extends (abstract) class Z接口，多重继承，interface 3 extends interface 1 interface 2类（除了抽象类）必须实现接口...
2018-08-23 20:31:42
593
原创 OpenLayers源码阅读（一）：从ol开始
版本选择 v4.6.5 说明： v3.0.0~v4.6.5采用Closure，而从v5.0.0 之后采用ES Modules。Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I ...
2018-08-13 21:11:02
3510
2
原创 Openlayers中加载WMTS地图服务，自定义级别、分辨率
需要以下几个参数origin（原点）resolutions（分辨率数组）matrixIds（分辨率对应的级别）projection（坐标系） 以arcgis server 发布的服务为例，如图 var projection = ol.proj.get(&quot;EPSG:4326&quot;);var resolutions = [0.00118973050291514, 5.94865...
2018-08-08 19:24:35
18090
1
原创 Openlayers中图片导出功能实现及可能存在的问题
openlayers v4.6.5给出的例子//引用FileSaver.js&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"&gt;&lt;/script&gt;//添加导出按钮&lt;a id="export-png&
2018-08-01 14:25:15
3696
3
原创 Tip：DataGrid 自动添加序号
DataGrid 自动添加序号步骤： 1、添加LoadingRow事件 2、在事件中获取序列号//以1开始计数private void DataGrid_LoadingRow(object sender, DataGridRowEventArgs e) { if (e.Row.GetIndex() > 0) {
2017-11-24 17:05:45
1152
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人