Men的博客

欢迎光临!

0%

Cesium创建

export const createMap = function(element, option) {
this._option = option ? option : {}
this._option.imageryProvider = this._option.imageryProvider ? new Cesium.UrlTemplateImageryProvider({
url:this._option.imageryProvider,
tilingScheme: new Cesium.WebMercatorTilingScheme(),
fileExtension: ‘png’
}) : layer.createImageryProvider({
type: ‘www_tdt’,
layer: ‘img’
});
this._option.terrainProvider = this._option.terrainProvider ? new Cesium.CesiumTerrainProvider({
url:this._option.terrainProvider,
requestVertexNormals: true,
requestWaterMask: true
}) : new Cesium.CesiumTerrainProvider({
url: ‘https://lab.earthsdk.com/terrain/42752d50ac1f11e99dbd8fd044883638',
requestVertexNormals: true,
requestWaterMask: true

});
this._option.orderIndependentTranslucency = this._option.orderIndependentTranslucency ? this._option.orderIndependentTranslucency : false;
this._option.contextOptions = this._option.contextOptions ? this._option.contextOptions : {
    webgl: {
        alpha: true,
        depth:true,
        stencil:true,
        antialias:true,
        premultipliedAlpha:true,
        //通过canvas.toDataURL()实现截图需要将该项设置为true
        preserveDrawingBuffer:true,
        failIfMajorPerformanceCaveat:true
    }
};
//需要进行可视化的数据源的集合
this._option.animation = this._option.animation ? this._option.animation : false; //是否显示动画控件
this._option.shouldAnimate = this._option.shouldAnimate ? this._option.shouldAnimate : true;
this._option.homeButton = this._option.homeButton ? this._option.homeButton : false; //是否显示Home按钮
this._option.fullscreenButton = this._option.fullscreenButton ? this._option.fullscreenButton : false; //是否显示全屏按钮
this._option.baseLayerPicker = this._option.baseLayerPicker ? this._option.baseLayerPicker : false; //是否显示图层选择控件
this._option.geocoder = this._option.geocoder ? this._option.geocoder : false; //是否显示地名查找控件
this._option.timeline = this._option.timeline ? this._option.timeline : false; //是否显示时间线控件
this._option.sceneModePicker = this._option.sceneModePicker ? this._option.sceneModePicker : false; //是否显示投影方式控件
this._option.navigationHelpButton = this._option.navigationHelpButton ? this._option.navigationHelpButton : false; //是否显示帮助信息控件
this._option.infoBox = this._option.infoBox ? this._option.infoBox : false; //是否显示点击要素之后显示的信息
this._option.requestRenderMode = this._option.requestRenderMode ? this._option.requestRenderMode : false; //启用请求渲染模式
this._option.scene3DOnly = this._option.scene3DOnly ? this._option.requestRenderMode : true; //每个几何实例将只能以3D渲染以节省GPU内存
this._option.sceneMode = this._option.sceneMode ? this._option.sceneMode : 3; //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode
this._option.fullscreenElement = this._option.fullscreenElement ? this._option.fullscreenElement : document.body; //全屏时渲染的HTML元素 暂时没发现用处
this._option.skyAtmosphere =  false; //关闭地球光环

let viewer = new Cesium.Viewer(element, this._option);
viewer._cesiumWidget._creditContainer.style.display = "none"; // 隐藏版权
viewer.scene.screenSpaceCameraController.zoomEventTypes = [
    Cesium.CameraEventType.WHEEL,
    Cesium.CameraEventType.PINCH,
];
viewer.scene.screenSpaceCameraController.tiltEventTypes = [
    Cesium.CameraEventType.PINCH,
    Cesium.CameraEventType.RIGHT_DRAG,
];
viewer.scene.skyBox.show = true;
//viewer.scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0);
//去掉entity的点击事件 start
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
//去掉entity的点击事件 end
viewer.scene.globe.depthTestAgainstTerrain = true;//深度检测

return viewer;

}

添加3dtile

 new Cesium.Cesium3DTileset(params).readyPromise
  .then((tileset) => {
    // console.log( tileset )

    that.tileset = tileset;

    that._scene.primitives.add(tileset);

    var position = that.getCartographic(tileset);

    that.position = position;
    //console.log(that.position)
    //that._flyTo(position[0], position[1], position[2]);
    
    that._viewer.zoomTo(tileset);

    that._cb.call(that,position);

    //添加悬浮样式
    if (
      that._option.showArea &&
      that._option.showArea.show &&
      that._option.showArea.material
    ) {
      that.addShowArea(that._option.showArea.material, position);
    }
    //是否拖拽
    if (that._option.drag) {
      that.creatArrowPolyLine(tileset, position);
    }
    //是否旋转
    if (that._option.rorate) {
      that.createAxisSphere(tileset, position);
    }
    //是否缩放
    if (that._option.scale) {
      that.createScaleAxisSphere(tileset, position);
    }
    that._initEvent2();
  })
  .otherwise(function(error) {
    console.log(error);
  });

添加glb

let model = this._scene.primitives.add(Cesium.Model.fromGltf(params));

    model.readyPromise.then((model) => {

        that.model = model;



        try {

            // Play and loop all animations at half-spead
            // model.activeAnimations.addAll({
            //     speedup : 0.5,
            //     loop : Cesium.ModelAnimationLoop.REPEAT
            // });


            that._flyTo(lng, lat, alt);

            that._cb.call(that);



            if (that._option.showArea && that._option.showArea.show && that._option.showArea.material) {

                that.addShowArea(that._option.showArea.material)
            }

            //是否拖拽
            if (that._option.drag) {

                that.creatArrowPolyLine(model, this._option.position)


            }

            //是否缩放
            if (that._option.needscale) {

                that.createScaleAxisSphere(model, this._option.position)

            }

            that._initEvent()

        } catch (error) {
            console.log(error)
        }

    })

}
var materials = new farsee3D.materials('EllipsoidFade',{color:Cesium.Color.AQUAMARINE,time:3000});

flyTo

this.viewerFlyTo = function (entity, heading, pitch, range) {
    this.viewer.flyTo(entity, {
        offset: {
            heading: Cesium.Math.toRadians(heading),
            pitch: Cesium.Math.toRadians(pitch),
            range: range
        }
    });
}
this.cameraFlyTo = function (pos, heading, pitch, roll) {
    viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(pos[0], pos[1], pos[2]),
        orientation: {
            heading: Cesium.Math.toRadians(heading),
            pitch: Cesium.Math.toRadians(pitch),
            roll: roll
        }
    });
}

GeoJsonDataSource
GeoJsonDataSource: function (geojsonUrl, callBack) {
var promise = Cesium.GeoJsonDataSource.load(geojsonUrl)
promise.then(function (dataSource) {
callBack(dataSource);
})
return promise
}

camera

// 获取当前镜头位置的笛卡尔坐标
let cameraPos = viewer.camera.position;
// 获取当前坐标系标准
let ellipsoid = viewer.scene.globe.ellipsoid;
// 根据坐标系标准,将笛卡尔坐标转换为地理坐标
let cartographic = ellipsoid.cartesianToCartographic(cameraPos);
// 获取镜头的高度
let height = cartographic.height;
// 根据上面当前镜头的位置,获取该中心位置的经纬度坐标
this.centerLon = parseFloat(Cesium.Math.toDegrees(cartographic.longitude).toFixed(8));
this.centerLat = parseFloat(Cesium.Math.toDegrees(cartographic.latitude).toFixed(8));
this.zoomIn = function () {
    viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(this.centerLon, this.centerLat, height / 1.8),
        duration: 1.0
    });
}
this.out = function () {
    viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(this.centerLon, this.centerLat, height * 1.8),
        duration: 1.0
    });
}

坐标转换

 WHCGCE2000ToWGS84(coord) {
    var wgs84 = '+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs  ';
    var WHCGCE2000 = '+proj=tmerc +lat_0=0 +lon_0=114.3333333333333 +k=1 +x_0=800000 +y_0=-3000000.0 +ellps=GRS80 +units=m +no_defs';
    return proj4(WHCGCE2000, wgs84, coord)
},