Newer
Older
KaiFengPC / cesiumGISmap.html
@zhangdeliang zhangdeliang 11 days ago 5 KB update
<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="./cesium/Build/SuperMap3D/Widgets/widgets.css" rel="stylesheet">
  <script type="text/javascript" src="./cesium/Build/SuperMap3D/SuperMap3D.js"></script>
  <script type="text/javascript" src="./cesium/web/libs/jquery/jquery.min.js"></script>
  <script type="text/javascript" src="./cesium/examples/webgl/js/supermap/SuperMap.Include.js"></script>
  <style>
    html,
    body,
    #Container {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      overflow: hidden;
    }
  </style>
</head>

<body>
  <div id="Container"></div>
  <!-- 气泡HTML -->

  <script type="text/javascript">
    var isInit = false

    function onload(SuperMap3D) {
      //初始化viewer部件
      window.viewer = new SuperMap3D.Viewer('Container', {
        infoBox: false,
        navigation: false,
        terrainProvider: new SuperMap3D.SuperMapTerrainProvider({
          url: 'https://www.supermapol.com/realspace/services/3D-stk_terrain/rest/realspace/datas/info/data/path',
          requestWaterMask: true,
          requestVertexNormals: true,
          isSct: false
        }),
      });

      var scene = viewer.scene;
      var camera = scene.camera;
      viewer._Widget._creditContainer.style.display = "none";
      scene.lightSource.ambientLightColor = new SuperMap3D.Color(0.65, 0.65, 0.65, 1);
      viewer.imageryLayers.addImageryProvider(new SuperMap3D.WebMapTileServiceImageryProvider({
        url: 'http://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={TileMatrix}&TILEROW={TileRow}&TILECOL={TileCol}&tk=3b8b6381848942b1e6bf37296e534130',
        layer: 'img',
        style: 'default',
        format: 'image/jpeg',
        tileMatrixSetID: 'mercator',
        maximumLevel: 18
      }))
      // viewer.imageryLayers.addImageryProvider(new SuperMap3D.WebMapServiceImageryProvider({
      //   url: 'http://218.64.81.37:8082/map2d/jiShui/wms',
      //   layers: 'wurenji_5cm',
      //   parameters: {
      //     service: "wms",
      //     format: "image/png",
      //     transparent: true,
      //     srs: "epsg:4326",
      //     height: 512,
      //     width: 512
      //   }
      // }))
      var promise = scene.open('https://{s}.wh-nf.cn:8090/iserver/services/3D-pipeData/rest/realspace',
        undefined, {
          subdomains: ['supermap0', 'supermap1', 'supermap2', 'supermap3'],
          autoSetView: true
        });

      viewer.camera.flyTo({
        destination: SuperMap3D.Cartesian3.fromDegrees(114.34250, 34.78526, 1200.0),
        orientation: {
          pitch: SuperMap3D.Math.toRadians(-35.0),
        }
      });
      var handler = new SuperMap3D.ScreenSpaceEventHandler(scene.canvas);
      handler.setInputAction(function (e) {
        // 获取点击位置笛卡尔坐标
        scene.pickAsync(e.position).then((data) => {
          if (data) {
            console.log(data)
            var getLayerId = data.id
            // 屏幕坐标转世界坐标——关键点
            var ellipsoid = viewer.scene.globe.ellipsoid;
            var cartesian = viewer.camera.pickEllipsoid(e.position, ellipsoid);
            //将笛卡尔坐标转换为地理坐标
            var cartographic = SuperMap3D.Cartographic.fromCartesian(cartesian);
            //将弧度转为度的十进制度表示
            window.lon = SuperMap3D.Math.toDegrees(cartographic.longitude);
            window.lat = SuperMap3D.Math.toDegrees(cartographic.latitude);
            var point2 = {
              longitude: window.lon,
              latitude: window.lat
            };
            doSqlQuery([getLayerId])
          }
        })
      }, SuperMap3D.ScreenSpaceEventType.LEFT_CLICK);


    }
    //管网查询
    function doSqlQuery(id) {
      var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;
      // getFeatureParam = new SuperMap.REST.FilterParameter({
      //   attributeFilter: id
      // });
      getFeatureBySQLParams = new SuperMap.REST.GetFeaturesByIDsParameters({
        IDs: id,
        toIndex: -1,
        datasetNames: ["kfData:ysline1_1", "kfData:第一二批WS_Point_1", "kfData:hsLine1_1",
          "kfData:wsLine1_1", "kfData:第一二批YS_Point_1", "kfData:第一二批YW_Point_1"
        ]
      });
      var url =
        'https://supermap0.wh-nf.cn:8090/iserver/services/data-pipeData/rest/data/'; // 数据服务地址
      getFeatureBySQLService = new SuperMap.REST.GetFeaturesByIDsService(url, {
        eventListeners: {
          "processCompleted": onQueryComplete, // 查询成功时的回调函数
          "processFailed": processFailed // 查询失败时的回调函数
        }
      });
      getFeatureBySQLService.processAsync(getFeatureBySQLParams);
    }

    function onQueryComplete(queryEventArgs) {
      var selectedFeature = queryEventArgs.originResult.features[0]; //
      console.log('拿到管网数据selectedFeature---', selectedFeature)
    }


    function processFailed(queryEventArgs) {
      console.log(queryEventArgs);
    }
    if (typeof SuperMap3D !== 'undefined') {
      window.startupCalled = true;
      onload(SuperMap3D);
    }
  </script>


</body>

</html>