Posted on 2021-05-21 09:07
eryar 阅读(1117)
评论(0) 编辑 收藏 引用 所属分类:
1.PipeCAD
IsoAlgo3d - IDF/PCF WebGL 3d viewer
eryar@163.com
Key Words. IDF, PCF, IsoAlgo, WebGL, WebAssembly
最近有国内外的友人提出基于WebGL的管道模型三维浏览器的想法很好,主要有以下几点优势:
l 基于HTML5的WebGL技术,不需要安装程序,即可以在电脑、手机、平板等所有支持WebGL的浏览器上使用;
l 三维模型加上尺寸标注、材料描述等信息,比二维的ISO图更直观;
l 对于现场制作安装管道的施工人员,可以使用手机直接查看模型,识图更简单;
l 可以部署在公司内部服务器,数据更安全;
当前国际主流管道设计软件都可以生成IDF/PCF文件,这两种文件格式都是用于Isogen生成管道轴测图。其中IDF为ISOGEN Data File,主要来自Intergraph PDS 和AVEVA PDMS。PCF为Piping Component File,主要来自Intergraph SmartPlant 3D和CADWorx。程序的主要技术思路为:通过将IDF和PCF文件中数据解析,生成管道三维模型及标注,并使用WebGL进行三维模型的展示。
首先是WebGL技术来展示三维模型,并能方便用户对视图和模型交互,如三维视图的旋转、缩放、移动等;模型的交互为选择一个模型,查询其相关的材料信息等。
![](https://img2020.cnblogs.com/blog/534255/202105/534255-20210514170622712-1848262583.png)
由于Javascript本身是开放的,为了保护核心代码和提高性能,可以使用WebAssembly来对核心业务代码进行封装。目前将其他编程语言转换在Javascript一般使用Emscripten SDK。下面来介绍一下Emscripten SDK的安装:
- 直接在https://github.com/emscripten-core/emsdk下载,下载后解压到指定目录;
- 修改解压后的文件emsdk.bat,配置好python;
- 启动命令窗口cmd,切换到解压目录,输入命令:
- emsdk install latest (有时安装不成功,是因为要从google下载,多试几次)
- emsdk activate latest
- 输入命令:emcc -v,显示如下信息表示安装成功。
![](https://img2020.cnblogs.com/blog/534255/202105/534255-20210514170632973-517103224.png)
为了方便开发,需要配置一个本地Web服务器。因为已经安装Python3环境,这里也使用Python来建立本地Web服务器,输入命令:
python -m http.server 8080 --directory d:/WebGL/
![](https://img2020.cnblogs.com/blog/534255/202105/534255-20210514170640173-1174545287.png)
从Python3.7开始,可以加-d/--directory 来指定文件夹了。
配置好开发环境,就可以将C/C++代码通过Emsdk封装成Javascript代码。在最新的浏览器上都提供了对WebAssembly的支持。
为了方便大家在移动端也能看到我的博文和讨论交流,现已注册微信公众号,欢迎大家扫描下方二维码关注。