Supermap WebGL根据经纬度获取高程值

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>三维获取DEM高程数据</title>
        
        <link href="./css/widgets.css" rel="stylesheet">
        <link href="./css/bootstrap.min.css" rel="stylesheet">
        <link href="./css/pretty.css" rel="stylesheet">
        <script src="./js/jquery.min.js"></script>
        <script src="./js/bootstrap.min.js"></script>
        <script src="./js/bootstrap-select.min.js"></script>
        <script src="./js/tooltip.js"></script>
        <script src="./js/config.js"></script>
        <script src="./js/include-classic.js"></script>
        <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script>
        
    </head>
    <body>
        
        <div id="container" style="width: 100%; height: 100%;"></div>
        
        <div id="toolbar" class="param-container tool-bar">
            <button type="button" id="point" class="button black">绘制点</button>
            <button type="button" id="clear" class="button black">清除</button>
        </div>
            
        <script>
            function onload(Cesium) {
                
                var viewer = new Cesium.Viewer('container');
                
                viewer.imageryLayers.addImageryProvider(new Cesium.TiandituImageryProvider({
                    token: URL_CONFIG.TOKEN_TIANDITU
                }));
                
                viewer.imageryLayers.addImageryProvider(new Cesium.TiandituImageryProvider({
                    mapStyle : Cesium.TiandituMapsStyle.CIA_C,
                    token: URL_CONFIG.TOKEN_TIANDITU
                }));
                
                // 添加地图服务
                viewer.imageryLayers.addImageryProvider(
                    new Cesium.SuperMapImageryProvider({
                      url:  "https://iserver.supermap.io/iserver/services/map-jingjin/rest/maps/京津地区地图"
                }));
                
                viewer.scene.camera.setView({
                    destination : new Cesium.Cartesian3.fromDegrees(x,y,z)
                });
                
                $('#point').click(function(){
                    handlerPoint.deactivate();
                    handlerPoint.activate();
                });
                
                var tooltip = createTooltip(document.body);
                
                var handlerPoint = new Cesium.DrawHandler(viewer,Cesium.DrawMode.Point);
                handlerPoint.activeEvt.addEventListener(function(isActive){
                    if(isActive == true){
                        viewer.enableCursorStyle = false;
                        viewer._element.style.cursor = '';
                        $('body').removeClass('drawCur').addClass('drawCur');
                    }
                    else{
                        viewer.enableCursorStyle = true;
                        $('body').removeClass('drawCur');
                    }
                });
                handlerPoint.movingEvt.addEventListener(function(windowPosition){
                    tooltip.showAt(windowPosition,'<p>点击绘制一个点</p>');
                });
                handlerPoint.drawEvt.addEventListener(function(result){
                    
                    tooltip.setVisible(false);
                    
                    pos = result.object._position;
                    
                    // 笛卡尔坐标转经纬度坐标
                    var cartographic = Cesium.Cartographic.fromCartesian(pos);
                    var longitude = Cesium.Math.toDegrees(cartographic.longitude);
                    var latitude = Cesium.Math.toDegrees(cartographic.latitude);
                    
                    // DEM数据服务
                    var gridCellQueryParam = new SuperMap.REST.GetGridCellInfosParameter({
                        dataSourceName: "xxx",
                        datasetName: 'xxx',
                        X: longitude,
                        Y: latitude
                    });
                    
                    // 数据服务
                    var gridCellQueryService = new SuperMap.REST.GetGridCellInfosService(
                        "http://localhost:8090/iserver/services/data-xxx/rest/data",
                        {
                            'eventListeners': {
                                'processCompleted': querySuccess,
                                'processFailed': queryFailed
                        }
                    });
                    
                    gridCellQueryService.processAsync(gridCellQueryParam); 
                    
                });
                
                function queryFailed(evt) {
                    console.log('查询失败');
                    console.log(evt.originResult.error.errorMsg);
                }
                
                function querySuccess(evt) {
                    
                    console.log(evt.result);
                    console.log(evt.result.value);
                
                    
                }
                        
            }
        </script>
        
    
    </body>
    </body>
</html>
Supermap WebGL根据经纬度获取高程值

友情链接更多精彩内容
