2.2M3D钻孔剖切 Tutorial

M3D

M3D的加载代码相对比较简单,如下所示

m3dlayer = webGlobe.append("http://192.168.10.186:6163/igs/rest/g3d/福田钻孔", {});

地下模式

地下模式的核心是关闭天空盒以及改变透明度以及调整光线角度,同时针对特定模型进行沉降操作已达到对应的地下效果。

webGlobe.viewer.imageryLayers.removeAll();
webGlobe.viewer.scene.skyAtmosphere.show = false;
webGlobe.viewer.scene.globe.enableTransparent = true;
webGlobe.viewer.scene.globe.baseColor = new Cesium.Color(1, 1, 1, 0.001);

加载完毕后的回调

m3dlayer = webGlobe.append("http://192.168.10.186:6163/igs/rest/g3d/福田钻孔", {
    loaded: function(layer) {
        // 加载完毕后执行业务逻辑
    },
});

图层的属性

M3D的图层属性保持Cesium的3DTIle一致 Cesium3DTileset

{
  url: { type: String, required: true },
  show: { typs: Boolean, default: true },

  /**
   * @type Cesium.Matrix4
   * @default Matrix4.IDENTITY
   */
  /* modelMatrix: { typs: Object, default: undefined }, */
  /**
   * @type Cesium.ShadowMode
   * @default ShadowMode.ENABLED
   */
  /* shadows: { type: Object, default: undefined }, */

  maximumScreenSpaceError: { type: Number, default: 16 },
  maximumMemoryUsage: { type: Number, default: 512 },

  cullWithChildrenBounds: { typs: Boolean, default: true },
  cullRequestsWhileMoving: { typs: Boolean, default: true },
  cullRequestsWhileMovingMultiplier: { type: Number, default: 60.0 },

  preloadWhenHidden: { typs: Boolean, default: false },
  preloadFlightDestinations: { typs: Boolean, default: true },
  preferLeaves: { typs: Boolean, default: false },

  dynamicScreenSpaceError: { typs: Boolean, default: false },
  dynamicScreenSpaceErrorDensity: { type: Number, default: 0.00278 },
  dynamicScreenSpaceErrorFactor: { type: Number, default: 4.0 },
  dynamicScreenSpaceErrorHeightFalloff: { type: Number, default: 0.25 },

  progressiveResolutionHeightFraction: { type: Number, default: 0.3 },

  foveatedScreenSpaceError: { typs: Boolean, default: true },
  foveatedConeSize: { type: Number, default: 0.1 },
  foveatedMinimumScreenSpaceErrorRelaxation: { type: Number, default: 0.0 },
  /**
   * @type Cesium3DTileset~foveatedInterpolationCallback
   * @default Cesium.Math.lerp
   */
  /* foveatedInterpolationCallback: { type: Function, default: undefined }, */
  foveatedTimeDelay: { type: Number, default: 0.2 },

  skipLevelOfDetail: { typs: Boolean, default: false },
  baseScreenSpaceError: { type: Number, default: 1024 },
  skipScreenSpaceErrorFactor: { type: Number, default: 16 },
  skipLevels: { type: Number, default: 1 },

  immediatelyLoadDesiredLevelOfDetail: { typs: Boolean, default: false },
  loadSiblings: { typs: Boolean, default: false },

  /**
   * @type Cesium.ClippingPlaneCollection
   */
  /* clippingPlanes: { typs: Object, default: undefined }, */
  /**
   * @type Cesium.ClassificationType
   */
  /* classificationType: { typs: Object, default: undefined }, */
  /**
   * @type Cesium.Ellipsoid
   * @default Ellipsoid.WGS84
   */
  /* ellipsoid: { typs: Object, default: undefined }, */

  /* pointCloudShading: { typs: Object, default: undefined }, */
  /**
   * @type Cartesian2
   * @default new Cartesian2(1.0, 1.0)
   */
  /* imageBasedLightingFactor: { typs: Object, default: undefined }, */
  /**
   * @type Cartesian3
   */
  /* lightColor: { typs: Object, default: undefined }, */
  luminanceAtZenith: { type: Number, default: 0.2 },
  /**
   * @type Array.<Cartesian3>
   */
  /* sphericalHarmonicCoefficients: { type: Array, default: undefined }, */
  specularEnvironmentMaps: { type: String, default: "" },

  debugHeatmapTilePropertyName: { type: String, default: "" },
  debugFreezeFrame: { typs: Boolean, default: false },
  debugColorizeTiles: { typs: Boolean, default: false },
  debugWireframe: { typs: Boolean, default: false },
  debugShowBoundingVolume: { typs: Boolean, default: false },
  debugShowContentBoundingVolume: { typs: Boolean, default: false },
  debugShowViewerRequestVolume: { typs: Boolean, default: false },
  debugShowGeometricError: { typs: Boolean, default: false },
  debugShowRenderingStatistics: { typs: Boolean, default: false },
  debugShowMemoryUsage: { typs: Boolean, default: false },
  debugShowUrl: { typs: Boolean, default: false }
}

动态剖切原理

将要切割的图层按照某一个切割面,进行切割,设置一个定时器不同的收缩切割面的距离,已达到动态切割的效果!

  1. 创建某个轴的切割面,本例是Y轴:

    var g_planeDiziti = new Cesium.ClippingPlane(
         new Cesium.Cartesian3(0.0, 1.0, 0.0),
         -200.0
       );
    
  2. 获取地质体的图层并绑定切割面

    assiselayer[0].clippingPlanes = new Cesium.ClippingPlaneCollection({
           modelMatrix: assiselayer[0].modelMatrix,
           planes: [g_planeDiziti],
           enabled: true,
         });
    
  3. 如果存在地形图层,则针对相机进行全局的地形图层的切割处理

    var g_planeTerTile = new Cesium.ClippingPlane(
         new Cesium.Cartesian3(0.0, 1.0, 0.0),
         -200.0
       );
    webGlobe.scene.globe.clippingPlanes = new Cesium.ClippingPlaneCollection(
         {
         modelMatrix: Cesium.Transforms.eastNorthUpToFixedFrame(
             transformCenter
         ),
         planes: [g_planeTerTile],
         enabled: true,
         }
     );
    
  4. 设置起始的切面距离,这里的距离根据业务,采取三角测量可以测出对应的距离

    var curDis = 10;
    // 定时器回调函数  --- 动态的改变切割面的距离
    function cutLayer(index) {
       let distance = -1 * index * 20;
       g_planeTerTile.distance = distance;
       g_planeDiziti.distance = distance;
     }