超图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/PowerEBM@建筑整合/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）打开场景，选择上方工具条中的【对象操作】->【截面与投影】->【投影面】，选择对应数据获取其投影面数据（非常重要！！！不然数据量太大，想进行属性查询？不存在可能性的）