超图supermap实现BIM模型的属性查询
有了BIM+GIS,实现室内室外一体化,室内导航等不再是梦想了哈!
这学期为了学bim+gis,断断续续开始学超图产品,还是小白一枚,若分享中有错误,欢迎批评指正!
关于BIM的属性查询,之前在网上没找到合适的解决方案,走了不少弯路,终于解决了!废话不多说,直接上干货!
相信有不少小伙伴像我一样,学习时候参考的这个范例http://support.supermap.com.cn:8090/webgl/examples/editor.html#S3MTiles_BIM
但是,这是个坑啊!入坑的小伙伴们让我看到你们的双手,知道自己不是一个人
我联系了超图的技术人员,给出的答复是这个BIM模型是矢量面贴上去的,发布的数据服务是多个数据聚合云云的(具体说法忘了,总之不要用这个撒)
需要参考的正确范例是这个http://support.supermap.com.cn:8090/webgl/examples/editor.html#S3MTiles
先把我的代码贴上来吧,后面解释一下几点需要注意的地方。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <title>属性查询</title> <link href="./Build/Cesium/Widgets/widgets.css" rel="stylesheet"> <link href="./css/pretty.css" rel="stylesheet"> <script src="./js/jquery.min.js"></script> <script src="./js/config.js"></script> <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script> <style> html, body, #cesiumContainer { width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;background-color: #000000; } </style> </head> <body> <div id="cesiumContainer"></div> <div id='loadingbar' class="spinner"> <div class="spinner-container container1"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> <div class="spinner-container container2"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> <div class="spinner-container container3"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> </div> <blockquote id="bubble" class="bubble"> <h2 id="title"></h2> <p id="des" class="word"></p> </blockquote> <script type="text/javascript"> function onload(Cesium) { var infoboxContainer = document.getElementById("bubble"); //初始化viewer部件 var viewer = new Cesium.Viewer('cesiumContainer',{ imageryProvider: new Cesium.BingMapsImageryProvider({ url : 'https://dev.virtualearth.net', mapStyle : Cesium.BingMapsStyle.AERIAL }) }); viewer.scene.undergroundMode = true; //设置开启地下场景 viewer.customInfobox = infoboxContainer; var scene = viewer.scene; var canvas = scene.canvas; var widget = viewer.cesiumWidget; $('#loadingbar').remove(); try { //添加S3M图层服务 var promise = scene.addS3MTilesLayerByScp('http://localhost:8090/iserver/services/3D-JiaNianHuaZhan2/rest/realspace/datas/[email protected]建筑整合/config', { name: 'jinjiang' }); Cesium.when(promise, function (layer) { if(!scene.pickPositionSupported){ alert('不支持深度拾取,属性查询功能无法使用!'); } //设置属性查询参数 layer.setQueryParameter({ url: 'http://localhost:8090/iserver/services/data-JiaNianHuaZhan/rest/data', dataSourceName: '建筑整合', dataSetName: 'PrjRegionResult', keyWord: 'SmID' }); //设置相机视角 scene.camera.setView({ //将经度、纬度、高度的坐标转换为笛卡尔坐标 destination : new Cesium.Cartesian3.fromDegrees(120.398294317173950,36.117298362827277,50), orientation : { heading : 4.7793869967010565, pitch : -0.5899023527373464, roll : 8.539835505416704e-12 } }); }, function (e) { if (widget._showRenderLoopErrors) { var title = '渲染时发生错误,已停止渲染。'; widget.showErrorPanel(title, undefined, e); } }); } catch (e) { if (widget._showRenderLoopErrors) { var title = '渲染时发生错误,已停止渲染。'; widget.showErrorPanel(title, undefined, e); } } //添加自定义infobox var title = document.getElementById("title"); var des = document.getElementById("des"); var myimg = document.getElementById("myimg"); //注册鼠标点击事件 viewer.pickEvent.addEventListener(function(feature){ console.log(feature); var title = Cesium.defaultValue(feature.NAME,''); var description=new Array() description[0]=Cesium.defaultValue("SMID:"+feature.SMID,''); description[1]=Cesium.defaultValue("SMSDRIW:"+feature.SMSDRIW,''); description[2]=Cesium.defaultValue("SMSDRIN:"+feature.SMSDRIN,''); description[3]=Cesium.defaultValue("ELEMENTID:"+feature.ELEMENTID,''); title.innerText = title; des.innerText = description; }); } </script> </body> </html>
回到小白的解决历程上来:
1.关于BIM模型的服务,你发布对了吗?
需要注意的几个点:
(1)BIM模型的数据源添加到场景中(友情提示,减少出错机会,初学者最好先用一个图层)
(2)打开场景,选择上方工具条中的【对象操作】->【截面与投影】->【投影面】,选择对应数据获取其投影面数据(非常重要!!!不然数据量太大,想进行属性查询?不存在可能性的)
(3)场景右键生成缓存,保存并关闭场景(关闭很重要!!!同一数据不能同时在desktop 和iServer中打开)
生成场景缓存时会有这样的提示,我就一个建议,别听它忽悠,别听它吓唬你!勇敢的生成场景缓存吧!离革命胜利又近了一步啦!
根据个人喜好修改下路径啥的,然后坐等进度条跑完。再提醒一次,完事儿记得保存并关闭!因为文件型数据源具有独占性!!!
(4)然后打开SUPERMAP ISERVER进行服务的发布,包括REST三维服务和数据服务!
我的iServer是免安装版的,所以要先start.bat启动服务.服务启动之后访问iserver就是这个界面。发布服务需要选择服务管理。
个人经验:这个路径尽量不要包含中文,否则点击下一步没反应!
选择这两种服务类型点击下一步发布即可。然后发布的数据服务就可以用在上述的DEMO代码中调试查看效果啦!给大家看下我的效果。作为一个妹子,我也深知这样的界面丑到你了,哈哈,我也觉得弹窗好丑,功能实现了最重要。
如果您有任何问题,欢迎联系我,我们一起讨论呀