- 博客(38)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 谷歌跨越导致的cookie问题
项目开发中，在请求第三方接口时，为了安全，往往需要接口认证。最常用的方法是先请求登录接口，接口后端在返回的response headers中写入cookie值；然后再请求具体的数据接口，此时，浏览器会根据请求的URL自动查找cookie，如果找到，则在request headers里写入cookie。过程如下图。...
2021-07-06 16:20:25
674
原创 WEBGL之一——坐标
要想用WEBGL绘图，那最基本的一点就是，绘制在哪里，即坐标是怎么的？下面这个坐标代表的是什么意思？vec4(0.0, 0.0, 0.0, 1.0)vec4(-1.0, 0.0, 0.0, 1.0)vec4(0.0, 1.0, 0.0, 1.0)为了搞明白这个问题，先把上面坐标点绘制在一个400X400的canvas，如下图：从上面的绘制结果，我们看出WEBGL中的顶点坐标与CSS的屏幕坐标是不一样的，WEBGL的中心原点在canvas的中心，x(-1,1),y(-1,1),z(-1,
2021-04-12 23:34:03
489
原创 cesium小场景鹰眼地图
一、基本需求由于项目需要，用基于CEIUSM引擎和3DMAX建模搭建一个小区级别的三维场景，在导航时，需要实现鹰眼小地图。一看到鹰眼小地图，我们会很自然地想到用百度地图或者别的什么地图加一个小图标，然后三维场景与小地图坐标同步就可以了。但是这里我想直接用图片来实现，主要原因有：（1）我的三维场景是随便放在一个地方的，并没有与小区真实坐标匹配；（2）三用3DMX建模时，为了美观，建模师把建模范围做了一定夸张。（3）鹰眼的主要目的，并不是要实现很精准的定位，而是知道当前的大致位置。基于以上.
2021-02-08 16:02:34
1625
1
原创 从CAD到shp
在很多的GIS项目中，应用最多的矢量数据可能就是shp、geojson格式，但是，客户给的地理数据总是千奇百怪的，比如CAD数据，并且是没有坐标系的CAD数据！那么如何从CAD数据得到shp数据格式呢？下面将一步一步介绍，如果有大佬有更好的方法，请不吝赐教，先谢谢了。事例是从客户给的DWG格式数据中提取管线数据，DWG数据的基本情况是：（1）数据有很多层，道路、河道等都有。本来是想把道路、河道等图层删除后...
2020-10-23 15:00:26
6952
2
原创 CESIUM例子学习（十四）——distance Display Conditions
每一个entity中的渲染要素都是可以单独控制的。如果在不同的视点距离显示不同的要素，可以通过可选属性distanceDisplayCondition来实现。代码如下：function addBillboardAndRectangle () { var entity = viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees(116.43299999999988, 39.915999999999954, 70)
2020-07-29 11:01:04
5691
1
原创 CESIUM例子学习（十四）——Clustering
Clustering，聚合功能，单从一个例子来看，似乎没有什么作用。但是在GIS项目中是应用得比较多的功能点，当一个区域很小，但需要显示的标注又非常多时，它就派上用场了。在C/S系统中，往往使用zoom与visible绑定来解决压盖问题，但并不能很好地解决，体验也不是很好，好久没用C/S系统了，不知道有没有平台把聚合功能整合进去。Clustering完美地解决了这个问题，再也不用担心加载的点太多而看不清楚的问题了。一、KML数据加载代码中是以加载KML数据为例的。首先是用KmlDataSource.
2020-07-28 18:35:02
3616
4
原创 CESIUM例子学习（十三）——Clamp To 3DModel
前面从例子中学习了绘制要素紧贴地表的操作。但是在项目中，紧贴地表可能是不够的，比如需要在模型顶上绘制一个label，难道要在模型顶上加上一个写死的高度的，否则label就会被模型覆盖。要解决这样的问题，学习Clamp To 3DModel应该可以帮上忙。原码中绘制的是动态变化的点，绘制的原理方法就是利用属性回调函数，实时更新pint点的位置。代码如下：function addPoint () { point = viewer.entities.add({ position:
2020-07-27 17:35:26
1560
1
原创 CESIUM例子学习（十二）——3D Tiles Styling
3D Tiles Styling，这应该是一个使用率最高的例子了吧，因为觉得它的使用场景实现是太多了。它是可以根据Cesium3DTileFeature属性来进行个性化渲染的功能，比如分级渲染，条件显示、甚至可以自定义计算函数进行渲染。这些功能的实现都很简单，根据项目需要，创建一个相应的Cesium3DTileStyle对你，并赋值给Cesium3DTileset即可完成。但前提条件是，你的3D Tiles的属性字段中得有需要字段与值。如何判断是否有相应字段的方法是，在加载完成3dtiles之后，绑定一个点
2020-07-25 18:22:25
4557
8
原创 CESIUM例子学习（十一）——3DTiles Clipping Planes（2）
前面一节学习了剖切模型的交互方法，这一节学习剖切BIM的方法，看了一下代码，现在对BIM的剖切其实用的是3dtiles的clippingPlanes可选属性，也就是说不仅仅是BIM，只要是3dtiles都可以剖切的，下面验证一下我的想法。下面用倾斜摄影做剖切测试。方法与模型加载剖切面类似，只是剖切面绑定时有一点点变化。因为3dtiles的构造函数是Cesium3DTileset，所以绑定是Cesium3DTileset的可选参数clippingPlanes。代码如下：function add3dt
2020-07-24 15:39:20
1217
1
原创 CESIUM例子学习（十一）——3DTiles Clipping Planes（1）
3DTiles Clipping Planes例子，可以很容易实现对BIM、Point Cloud、Instanced、Model的任意剖切，其中Instanced是到底是一个什么对象，是怎么来的还不清楚。3DTiles Clipping Planes，对于BIM说来应用场景是有的，比如，需要查看一个建筑内部，应用从上到下的剖分，可以查看内部的结构。但对于点云和model有什么用呢？反正到现在我还没想出来。但从学习的角度去看，还是可以的。一、模型剖切...
2020-07-24 00:59:47
3231
4
原创 CESIUM例子学习（十）——PostProcessStage（fog）
cesium里的PostProcessStage功能是在1.46之后才加上去的。雾用到了
2020-07-22 00:18:55
4282
4
原创 CESIUM例子学习（九）——Primitive(3)
geometry实在是太多了，多也要一个一个地学。学习的过程中不仅仅是用Primitive加载各种geometry。在这个过程中也加深对cesium的印象，至少混过脸熟，然后熟就能生巧。特别是学习这种事，要自己亲手去做去练习才能有更好的体会。一、Polyline(线)cesium提供了SimplePolylineGeometry、PolylineGeometry、PolylineVolumeGeometry、PolylineVolumeOutlineGeometry、GroundP...
2020-07-18 18:49:11
4694
4
原创 CESIUM例子学习（九）——Primitive(2)
上一节学习了Primitive加载BoxGeometry和RectangleGeometry。
2020-07-18 10:55:08
4972
2
原创 CESIUM例子学习（九）——Primitive(1)
在学习Primitive前，首先感谢GISEarth大神的https://blog.csdn.net/happyduoduo1/article/details/51868042这篇博文。下面的Cesium支持的几何图形，是直接从他的博文中截图的，再次感谢。cesium加载数据方式多种多样，一般用entity、dataSources和Primitive。其中entity是最高级的，基本上是统一的使用样式，比较容易上手。之前学习过程中都是用entity，今天学习一下Primitive加载。在看CESIU
2020-07-17 22:11:19
3509
2
原创 CESIUM例子学习（八）——Geometry and Appearances（2）
一、wall(墙)cesium里提供了绘制墙的方法，也就是垂直于地表的一个面。绘制原理是沿着一条线，利用线上各点的最大高度和最小高度来绘制垂直于地表的面。默认情况下，最小高度是0，代码如下：function addWall () { let entity = viewer.entities.add({ wall: { ////指定墙顶上一系列的点 positions: Cesium.Cartesian3.fromDegrees
2020-07-16 11:44:05
2158
2
原创 CESIUM例子学习（八）——Geometry and Appearances（1）
这一节是关于在cesium地球上绘制各种要素的，包括矩形、多边形、圆、椭圆、柱体、锥体、盒子和球体。个人觉得这个内容应该放在第一节先学，因为cesium很多东西都是以绘制为基础。一、Rectangle（矩形）1、加载RectangleRectangle就是通过传入的两个点，在地球上绘制一个矩形。本来一个矩形应该需要四个点，但函数只需要两个点，如下图API：解释得明白，也就是传入矩形的左下角和右上角。如果传成了左上角和右下角，会得报如下错误：正确代码如下：function a
2020-07-15 17:18:36
3264
6
原创 CESIUM例子学习（七）——Classification Types
这是一个非常有用的例子。主要讲的是在3dtiles倾斜摄影上的绘制与单体化实现。一、在倾斜摄影上绘制线（失败！）原因找到了，版本问题该例子的第一个是以三种模式绘制线，即帖地模式、帖3dtiles模式和两同时绘制模式。1、如下例子原代码：var polyline = viewer.entities.add({ polyline: { positions: Cesium.Cartesian3.fromDegreesArray([ -75.60217330403601,
2020-07-14 18:18:24
3455
1
原创 CESIUM例子学习（六）——Cardboard
在初看到这个例子时，感觉这个例子没有什么可学的。仔细看完之后，至少可以学习到两个方面的内容：（1）基本的相机动画实现；（2）cesium相机绑定，即把相机绑定到模型上，当模型运动时，带着相机一起运动；一、动画基本设置start:开始时间，设置动画开始时间，只是一个与结束时间相对的时间，设置到哪年并不影响动画。stop:结束时间，也就是开始时间加上动画时长，时间最好是等于或略大于动画时长，否则，可能会导致动画不完整。同样的动画数据，设置不同的动画时长，如下对：动画时长370，正常动画时长动
2020-07-11 21:06:30
1418
1
原创 CESIUM例子学习（五）——Camera. fyTo与viewer.flyTo（3）
前面两节学习了对Camera的控制，但是还有一个疑问，Camera. fyTo（）与viewer.flyTo（）这两个函数有区别吗？之前我自己也没有去仔细看过，感觉两个函数应该没什么区别，都是定位而已。一、Camera. fyToFlies the camera from its current position to a new position，相机从当前位置飞到新的位置。参数如下图：其中destination：指的是相机的目标位置，是相机所在位置，这一点一定要注意；orientat
2020-07-10 11:17:23
8175
1
原创 CESIUM例子学习（五）——Camera Tutorial（2）
这一节是关于Camera类里面移动的。一、Camera的move方法Camera中提供了六个move方法。其移动方向上以屏幕为参考的。moveBackward（后退，向屏幕外面）、moveForward（向前，向屏幕里面）、moveLeft(向左)、moveRigth(向右)、moveUp(向上，屏幕上方)、moveDown(向下，屏幕下方)二、例子用键盘的Q、W、E、A、S、D来控制摄像机的移动。1、注册键盘事件代码如是下： ////对应事件 var flags = {
2020-07-08 15:50:00
480
原创 CESIUM例子学习（五）——Camera Tutorial（1）
在cesium中，对场景的控制，是项目的基本操作，比如，把场景控制在某个范围内，特别是小场景，摄像机只能在厂区范围内；游戏中用A、W、S、D来控制方向等。这一节的例子就是关于这些的。一、cesium场景模式cesium场景模式分为三种模式：三维模式、二维模式和2.5维模式，2.5维模式也叫哥伦布模式。三维模式可以对场景进行全角度浏览；二维只能从场景正上方俯视；2.5维可以有一定的倾斜和旋转，观察角度间于二维和三维之间。二、几个控制场景的属性下面代码中的属性，默认情况下都是为true的，所以，
2020-07-08 14:37:43
723
原创 CESIUM例子学习（四）——CallbackProperty
cesium号称是集显示时空数据于一体的三维引擎。空间数据的展示我们已经见到，对于时间上的数据，我觉得CallbackProperty是最大功臣。因为使用CallbackProperty，cesium中一切可视化的要素都可以与时间联系起来。一、定义CallbackProperty函数定义CallbackProperty函数代码如下：newCesium.CallbackProperty(getEndPoint,isConstant)function getEndPoint (time, r..
2020-07-07 16:22:16
9176
2
原创 CESIUM例子学习（三）——billboard
一、什么是billboardbillboard也叫广告牌，用图片标注的形式表示地理点位信息。是一种特别简单的模型(D3D里面好像是这么说的)，它会自动计算，使图片下面始终面向摄像机，这种技术也叫广告牌技术。二、billboard加载以entity方式加载billboard，代码如下： var position = Cesium.Cartesian3.fromDegrees(116.43299999999988, 39.915999999999954) var entity = vi
2020-07-07 13:44:07
8779
原创 CESIUM例子学习（二）——模型颜色属性
前面一节搭建了cesium场景并加载了一个飞机模型，同时调整模型的姿态与缩放比例。这一节学习模型颜色属性。主要是调整模型颜色、透明度、颜色混合模式、外轮廓线颜色和外轮廓线宽。一、模型颜色与透明度模型加载到场景后，如果不设置其颜色属性，它显示出来的就是建模时的材质颜色。如下图：设置模型颜色与透明度也很简单，一句话搞定代码如下：entity.model.color = Cesium.Color.fromAlpha(Cesium.Color.RED, 1);//设置模型颜色与透明度二、颜
2020-07-04 15:34:18
8485
原创 CESIUM例子学习（一）——动态模型加载
前言一直在学习cesium，时断时续地用它，但感觉哪里不对，什么都了解一点，但什么没有深入地去研究，都是浮于表面。于是下定决心：从头开始，从cesium的sandcastle例子开始，系统地学一下cesium。并把它记录下来，以便后面用时能很快找到。一、场景与动态模型加载把基本框架搭起来之后，就开始第一个例子。如下图（发动机叶片是转动的）：viewer配置如下图：因为模型的发动机叶片是转动的，为了使叶片转动起来，shouldAnimate:true。二、模型旋转这里的模.
2020-07-03 19:19:15
3686
原创 cesium模型纹理替换
一、概述一个cesium管网项目中，默认情况下，用不同颜色表示不同的管网类型。当点击到对应的管网时，需要动态替换管网的纹理，以达到表达管网流向的目的。二、替换步骤1、添加需要替换的图片到Resourc中Cesium.Resource.fetchImage({url:'./Earth/images/gw/'+name+'.jpg'}).then(function(image){gwImgList[name]=imag...
2020-06-26 17:57:29
3849
3
原创 服务器tomcat配置ssl证书
一、概述想做一个地图浏览玩具，在手机上玩。要用到百度地图和百度定位API。把代码开发好后，发现网站协议需要是HTTPS;于是开启了走上建站的不归路：（1）270多购买了一台玩具级的腾讯云服务器，可用3年；（2）19元购买一个域名，可用一年。花这么多钱啊，心疼一秒钟！！二、申请SSL 由于服务器是在腾讯云上，于是就在腾讯云上申请了SSL。请参考数据工作者的这篇文章。三、设置服务防火墙当然，你可以把防火墙干倒关掉，不要防火墙。但是建议不要这么鲁莽！其实把网站端口设置到白名单中可以了。设置..
2020-06-22 19:23:37
1313
原创 CESIUM空间点坐标在某方向上平移运算
一、A、B两点,求在A、B之前，求一点C空间，C位于线段AB的1/4处，也就是BC长度是BA的0.25倍。如下图计算方法为：（1）求出A到B的向量，也就是A点相对于B点来说的坐标，即以B点为坐标中心的点坐标值。应用CESIUM提供的方法：let AtoB = Cesium.Cartesian3.subtract(cartesianA, cartesianB, new Cesium.Cartesian3());(2) 求出1/4的AB向量,也就是 C相对B点的坐标：let ca
2020-05-24 23:43:55
3197
原创 obj2gltf
因为我是Cesium小白，大神们绕道吧。进行下面的步骤，需要你的电脑已经安装了node和npm，如果你不知道是什么，那你比我还白，就去找别的资料先安装好。在网上找到obg转gltf的工具，大多数据都是从：https://github.com/AnalyticalGraphicsInc/obj2gltf这里下载安装。很多大神的帖子，下面也在好多问题。大多是下载完了就不会用了。我就从下载完后详细地开始吧。下载下来后的代码结构应该是这样的，如下图：对，没有ceium文件夹，只有这些。在specs文
2020-05-11 17:16:57
3142
2
原创 windows下nginx服务器
在之前的项目中，打包好一个网站之后，总得找一个服务器然后发布到IIS或tomcat或别的。其实对于一些小的项目和文件服务来说nginx就可在满足。nginx.config配置如下图访问路由：通过http://localhost/mapgis/appfs/#/ 即可访问。如下图：...
2020-02-25 15:24:01
129
原创 不用cookie缓存的数据请求
在项目实时数据请求中，常会被缓存数据影响，导致不能获取到最新数据。解决办法是在请求的连接后面加上时间戳，如下： let url = this.$store.state.mapConfig.services.xinxijiebao + 'startTime=' + startTime + '&endTime=' + endTime + '&t=' + new Date().ge...
2019-09-07 20:01:49
215
原创 使用WebSocket
不好意思，我是JS小白，这篇文章仅仅是记录了我自己的使用过程，如果也能帮到某位同仁，本人非常荣幸。由于项目需要在后台更新数据后，前端要及时地作出相应更新。所以用到了WebSocket，但是由于项目还用到了其它IE插件，所以也必须保证系统在IE下能正常运行。WebSocket使用的伪代码如下： // 创建WebSocket连接 createWebSocket () { ...
2019-09-07 19:54:07
105
原创 Vue程序启动过程
本人小白，只是记录下学习的体会供自己日后参考，如果能帮到你一点点，万分欣慰。代码结构如下图：其运行过程如图中的编号顺序，index.html是整个程序的入口。代码如下：<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" c...
2019-05-13 13:55:49
1736
原创 SFS发布非shp导入的postgresql点空间数据需要注意的问题
先解释下非shp导入的postgresql点空间数据，postgresql可以通过扩展，用插件直接导入shp文件到postgresql数据库中。也可以自己创建一个空表，然后往里面同步或通过脚本写入数据。文中非shp导入指的是后者。postgresql数据同步，在前一篇kettle spoon同步oracle的点空间数据到postgresql中做了介绍，其它空间数据的同步也大同小异。问题1：...
2019-03-08 15:20:16
235
原创 kettle spoon同步oracle的点空间数据到postgresql
为什么要同步oracle空间数据到postgresql？（1）公司之前的所有空间数据都是存储到oracle数据库中，大家都知道oracle数据库费用很高，（2）项目处于前期阶段，空间数据内容还不太确定，在后期需要重新编辑；（3）最终数据会用skyline SFS发布出来，在前端加载。（4）趁机会学习点新的东西。下面来说说postgresql空间扩展与kettle spoon同步oracle空间...
2019-03-08 14:24:32
2641
2
原创 C# LOCK测试
定义了一个DataTable dt,两个Button,一个createDt，启动一个线程createThread ，死循环往dt里写数据。另一个deleteDt,启动别一个线程deleteThread ，手动点击，清空dt。原码如下： public partial class Form1 : Form { DataTable dt; public...
2018-10-13 23:25:47
329
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人