作者:taco


测试结果

 测试代码

<!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>3D Tiles</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 type="text/javascript" src="../../Build/Cesium/Cesium.js"></script>
</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>
<script>
    function onload(Cesium) {
        var obj = [6378137.0, 6378137.0, 6356752.3142451793];
        Cesium.Ellipsoid.WGS84 = Object.freeze(new Cesium.Ellipsoid(obj[0], obj[1], obj[2]));
        var viewer = new Cesium.Viewer('cesiumContainer');
        var scene = viewer.scene
        scene.lightSource.ambientLightColor = new Cesium.Color(0.65, 0.65, 0.65, 1);

        var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
            url: 'http://localhost:8090/iserver/services/3D-ThreeDTilesCache-tileset2/rest/realspace/datas/tileset/config', isSuperMapiServer: true 
        }));
		 tileset.tileLoad.addEventListener(function(tile) {
		     let content = tile.content;
		     let featuresLength = content.featuresLength;
		     console.log("要素数量为:");
		     console.log(featuresLength);
		     console.log("第一个要素为:");
		     let feature = content.getFeature(0);
		     console.log(feature);
		 })

        		  const hightLighted = {
		      feautre: undefined,
		      originalColor: new Cesium.Color(),
		  }
		 
		  viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(event) {
		      // 清除之前的高亮元素
		      if (Cesium.defined(hightLighted.feature)) {
				  
		          hightLighted.feature.color = hightLighted.originalColor;
		          hightLighted.feature = undefined;
		      }
		 
		      // 选择新要素
		      const pickedFeature = viewer.scene.pick(event.position);
			  console.log(pickedFeature)
		      if (!Cesium.defined(pickedFeature)) {
		          return;
		      }
		 
		      // 存储选中要素的信息
		      hightLighted.feature = pickedFeature;
		      Cesium.Color.clone(
		          pickedFeature.color,
		          hightLighted.originalColor
		      );
		      // 高亮选中元素
		      pickedFeature.color = Cesium.Color.YELLOW;
		  }, Cesium.ScreenSpaceEventType.LEFT_CLICK)


        tileset.readyPromise.then(function () {
            var boundingSphere = tileset.boundingSphere;
            viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0.0, -0.5, boundingSphere.radius));
            viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
        }).otherwise(function (error) {
            throw(error);
        });
        $('#loadingbar').remove();
    }
    if (typeof Cesium !== 'undefined') {
        window.startupCalled = true;
        onload(Cesium);
    }
</script>
</body>
</html>

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐