基于SuperMap三维WebGL开发总结一

相关参考https://blog.csdn.net/supermapsupport/article/details/50035835
前言
越来越多的GIS系统都用到了三维数据，通过GIS和三维模型结合更加直观的了解事物的空间关系，有助于对事物场景进行分析和展示，传统的三维展示都是需要一些三维插件来查看，非常不方便，插件占用空间很大本身就会对浏览器效率造成很大影响，因此，随着前端技术的发展，一款牛逼的web图形库webgl应运而生，能够让我们通过js去使用GPU进行浏览器图形渲染。
SuperMap的三维免插件开发使用的是WebGL,9D及以上版本支持较好。今天我们从0开始一起探讨学习开发流程，中间也会写出自己在开发中遇到的一些坑，以及技术支持帮助的一些解决方案。
本次开发的案例是在影像图图层下创建地下管线，主要功能有管线数据处理、影像图层加载、透明度设置、开挖设置、前端展示、属性查询这几个常用功能。
数据准备
一、管线数据处理
使用的数据是超图管网提供的管线数据，我需要的数据是将管线埋藏到地下，因此需要对数据进行相关处理，包括将他的节点、管线网络、爆管点等设置到同一个水平点进行展示，主要步骤如下：
1、设置模型的高度，即管线的Z轴高度
找到管点数据集，他是在三维网络数据集下面的一个三维点数据集，如下图

将三维点数据通过数据—类型转化-将三维点转化为二维点

接下来浏览新生成的二维点数据集，列中多出一个z字段，选择更新该列的数值，如果在地下改为负值即可，
接下来将修改后的二维点数据集进行三维转换，转换方式通过数据—类型转化-将二维点转化为三维点
2、交通分析
由于管线是由管点通过连线而成，需要构建三维网络，如下图

进行构建三维网络，设置网络参数

保存以后会生成一个三维网络数据集，他是一个有上下级的数据集，三维网络和三维点构成的数据集
如下图
3、将网络数据集添加到球面

4、设置爆管点
在地下管线中有的管点爆裂，需要进行爆裂展示，具体操作，空间分析—网络分析—爆管点分析（其他应该类似），

选择合适的位置放置爆管点位置

右键，选择右侧 爆管点，导出数据集，生成三维点数据，如果爆管点的空间位置和网络数据不在一个空间位置的话可以通过三维点转换成二维点进行空间信息修改，修改完成以后再转回三维点即可。

5、生成场景缓存
选择场景，右键生成场景缓存

缓存类型选择三维切片，文件类型为s3m格式。
注：爆管点的图标可以通过图层风格进行定义，选择图标文件进行自定义图标上传，如下图

二、数据发布
拷贝生成的缓存数据和工作空间及数据源到服务器，通过Iserver进行服务发布，发布时选择三维服务，如果需要数据编辑，可以选择数据服务，发布即可，发布完成以后通过Iserver自带浏览功能进行浏览展示。

三、web开发