SQL查询，点击三维图层，查询属性信息

html要引入的js文件

<!-- webgl中cs的引入-->
<link rel="stylesheet" href="Build/Cesium/Widgets/widgets.css">
<link rel="stylesheet" href="Build/Cesium/Widgets/pretty.css">
 <link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-table.css">
<link rel="stylesheet" href="javascript/zTree/css/zTreeStyle/zTreeStyle.css">
<link rel="stylesheet" href="font/iconfont.css">
 <link rel="stylesheet" href="css/bubble.css">
<!-- index界面自己的cs-->
 <link rel="stylesheet" href="css/index.css">

<script type="text/javascript" src="javascript/jquery.min.js"></script>
<script type="text/javascript" src="javascript/bootstrap.min.js"></script>
<script type="text/javascript" src="javascript/bootstrap-table.min.js"></script>
<!-- webgl关键js引入，引入的其实就是javascript文件下的main.js，在main.js中的path路径下，又写了其他的js文件的引入，所以真正引入的是main中的js文件。注意引入时要进mian.js里看一下path下的引入路径对否,可能有误-->
<script type="text/javascript" src="javascript/require.min.js" data-main="javascript/main"></script>
<!-- iserver中sql关键js引入-->
 <script type="text/javascript" src="js/supermap/SuperMap.Include.js"></script>
<!-- 三维出图js-->
<script type="text/javascript" src="js/bn_webGl.js"></script>
<!-- 主页面自己的点击事件js-->
<script type="text/javascript" src="js/index.js"></script>
<!-- 气泡引入-->
 <script type="text/javascript" src="js/CommonBubble.js"></script>

 属性查询弹出气泡一定要在三维出图时设置图层可选中：

    layers.forEach(function(ele){
                //  设置图层为可选中状态
                ele.selectEnabled = true;
                ele.clearMemoryImmediately=false;      
                ele.indexedDBSetting.isGeoTilesRootNodeSave=true;
                ele.indexedDBSetting.isGeoTilesSave=true;                 
        });

js代码：

//  拾取属性
function select(){
    handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
    handler.setInputAction(function (e) {
        // 获取点击位置笛卡尔坐标
        var position = scene.pickPosition(e.position);
        // var pick =  viewer.scene.pick(e.position);
        //将笛卡尔坐标转化为经纬度坐标
        var cartographic = Cesium.Cartographic.fromCartesian(position);
        var longitude = Cesium.Math.toDegrees(cartographic.longitude);
        var latitude = Cesium.Math.toDegrees(cartographic.latitude);
        var height = cartographic.height;
        // 获取选中的模型
        var selectedLayer = viewer.scene.layers.getSelectedLayer();
        var modelSelected,layerName,dataSetName;
        //  没有选中则返回，选中则查询
        if(selectedLayer == undefined||selectedLayer["name"] == undefined){
            return;
        }else{
            modelSelected = selectedLayer.getSelection();
            // 获取图层名PL_RL@TAIBAI
            layerName = selectedLayer.name;
            // 处理成查询的格式,["TAIBAI:PL_RL"]，数据源是TAIBAI，数据集是PL_RL
            //http://127.0.0.1:8090/iserver/services/data-pipidata/rest/data/datasources/TAIBAI/datasets/PL_RL，数据源是TAIBAI，数据集是PL_RL
            dataSetName = '["'+layerName.substring(layerName.indexOf("@")+1,layerName.length)+':'+layerName.substring(0,layerName.indexOf("@"))+'"]';
        }
        // 拼接filter条件，smid=0
        var filter='smid='+modelSelected[0];
        // 参数分别是url，过滤条件，dataSetName
        queryBySql("http://127.0.0.1:8090/iserver/services/data-pipidata/rest/data", filter, dataSetName, function (result) {
            debugger;
            var data = result.result.features[0].attributes;
            var material =  data.MATERIAL;
            // 管径 毫米
            var ds = data.D_S;
            // 终点高程
            var eh = data.E_H;
            // 起点高程
            var sh = data.S_H;
            var divId="popup00";
            $("#"+divId).remove();
            var bubble = $("<div id='"+divId+"' class='bubble'><div class='iconClose'><i class='iconfont icon-guanbi' onclick='closeThisBubble(this)'></i></div></div>");
            var bubbleDiv ="<div class='popup-main'>";
            bubbleDiv+="&nbsp;&nbsp;&nbsp;<p>材质:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+material+"</p>";
            bubbleDiv+="&nbsp;&nbsp;&nbsp;<p>起点高程(米)"+sh+"</p>";
            bubbleDiv+="&nbsp;&nbsp;&nbsp;<p>终点高程(米):"+eh+"</p>";
            bubbleDiv+="&nbsp;&nbsp;&nbsp;<p>管径(毫米):&nbsp;&nbsp;&nbsp;&nbsp;"+ds+"</p>";
            debugger;
            bubble.append(bubbleDiv);
            $(viewer._element).append(bubble);
            var position = Cesium.Cartesian3.fromDegrees(parseFloat(longitude), parseFloat(latitude),parseFloat(height));
            //气泡样式
            var commonBubble = new CommonBubble(viewer.scene,divId);
            //气泡位置
            commonBubble.showAt(position);
            //气泡显示
            commonBubble.visibility(true);
        });
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}

//  iserver的sql查询
function queryBySql(url, attributeFilter, datasetNames, processCompleted, processFailed) {
    var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;
    getFeatureParam = new SuperMap.REST.FilterParameter({
        attributeFilter: attributeFilter,
    });
    getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
        queryParameter: getFeatureParam,
        toIndex: -1,
        // returnContent: false,
        datasetNames: datasetNames
    });
    getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(url, {
        eventListeners: {
            "processCompleted": processCompleted,
            "processFailed": processFailed
        }
    });
    getFeatureBySQLService.processAsync(getFeatureBySQLParams);
}