Cesium 基於MapBox底圖加載3DTiles 模型

3DTiles 模型採用   CATIA V5 R22 ---> HSF+SQLite --->GLB--->B3DM 

var extent = Cesium.Rectangle.fromDegrees(75, 60.808406, 135.313421, 10);
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent;
Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;
Cesium.Ion.defaultAccessToken = "你的Token";
Cesium.CreditDisplay.cesiumCredit = "測試";
var viewer = new Cesium.Viewer('cesiumContainer', {
    animation: false,//是否建立動畫小器件，左下角儀表
    baseLayerPicker: false,//是否顯示圖層選擇器
    fullscreenButton: true,//是否顯示全屏按鈕
    geocoder: true,//是否顯示geocoder小器件，右上角查詢按鈕
    homeButton: true,//是否顯示Home按鈕
    infoBox: false,//是否顯示信息框
    sceneModePicker: true,//是否顯示3D/2D選擇器
    selectionIndicator: false,//是否顯示選取指示器組件
    timeline: false,//是否顯示時間軸
    navigationHelpButton: false,//是否顯示右上角的幫助按鈕
    scene3DOnly: true,//若是設置爲true，則全部幾何圖形以3D模式繪製以節約GPU資源
    clock: new Cesium.Clock(),//用於控制當前時間的時鐘對象
    selectedImageryProviderViewModel: undefined,//當前圖像圖層的顯示模型，僅baseLayerPicker設爲true有意義
    //imageryProviderViewModels: Cesium.createDefaultImageryProviderViewModels(),//可供BaseLayerPicker選擇的圖像圖層ProviderViewModel數組
    selectedTerrainProviderViewModel: undefined,//當前地形圖層的顯示模型，僅baseLayerPicker設爲true有意義
    terrainProviderViewModels: Cesium.createDefaultTerrainProviderViewModels(),//可供BaseLayerPicker選擇的地形圖層ProviderViewModel數組
    skyBox: new Cesium.SkyBox({
        sources: {
            positiveX: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_px.jpg',
            negativeX: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_mx.jpg',
            positiveY: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_py.jpg',
            negativeY: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_my.jpg',
            positiveZ: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_pz.jpg',
            negativeZ: '/Build/Cesium/Assets/Textures/SkyBox/tycho2t3_80_mz.jpg'
        }
    }),//用於渲染星空的SkyBox對象
    fullscreenElement: document.body,//全屏時渲染的HTML元素,
    useDefaultRenderLoop: true,//若是須要控制渲染循環，則設爲true
    targetFrameRate: undefined,//使用默認render loop時的幀率
    showRenderLoopErrors: false,//若是設爲true，將在一個HTML面板中顯示錯誤信息
    automaticallyTrackDataSourceClocks: true,//自動追蹤最近添加的數據源的時鐘設置
    contextOptions: undefined,//傳遞給Scene對象的上下文參數（scene.options）
    sceneMode: Cesium.SceneMode.SCENE3D //初始場景模式
});

var mapbox = new Cesium.MapboxImageryProvider({
    mapId: 'mapbox.satellite',
    accessToken: '你的Token'
});
viewer.imageryLayers.addImageryProvider(mapbox);

var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({ url: '/files/test/tileset.json' }));
viewer.scene.primitives.add(tileset);

tileset.readyPromise.then(function (tileset) {
    viewer.scene.primitives.add(tileset);
    viewer.zoomTo(tileset, new Cesium.HeadingPitchRange(0.5, -0.2, tileset.boundingSphere.radius * 1.0));
}).otherwise(function (error) {
    console.log(error);
});

Cesium.CreditDisplay.cesiumCredit = null;
// 建立DIV標籤
var bubbleDiv = document.createElement('div');
viewer.container.appendChild(bubbleDiv);
bubbleDiv.className = 'bubble';
bubbleDiv.style.display = 'none';
bubbleDiv.style.position = 'absolute';
bubbleDiv.style.bottom = '0';
bubbleDiv.style.left = '0';
bubbleDiv.style['pointer-events'] = 'none';
bubbleDiv.style.padding = '4px';
bubbleDiv.style.zIndex = 100;

// 有關當前選定功能的信息
var selected = {
    feature: undefined,
    originalColor: new Cesium.Color()
};
var selectedEntity = new Cesium.Entity();
// 獲取默認的鼠標左鍵處理程序
var clickHandler = viewer.screenSpaceEventHandler.getInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
// 若是不支持輪廓，請在鼠標懸停時將特徵顏色更改成黃色，在單擊鼠標時將特徵顏色更改成綠色。
if (Cesium.PostProcessStageLibrary.isSilhouetteSupported(viewer.scene)) {
    //支持剪影
    var silhouetteBlue = Cesium.PostProcessStageLibrary.createEdgeDetectionStage();
    silhouetteBlue.uniforms.color = Cesium.Color.BLUE;
    silhouetteBlue.uniforms.length = 0.01;
    silhouetteBlue.selected = [];

    var silhouetteGreen = Cesium.PostProcessStageLibrary.createEdgeDetectionStage();
    silhouetteGreen.uniforms.color = Cesium.Color.LIME;
    silhouetteGreen.uniforms.length = 0.01;
    silhouetteGreen.selected = [];

    viewer.scene.postProcessStages.add(Cesium.PostProcessStageLibrary.createSilhouetteStage([silhouetteBlue, silhouetteGreen]));

          viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
            // 若是先前選擇了功能，請撤消突出顯示
            silhouetteGreen.selected = [];

            // P選擇一個新功能
            var pickedFeature = viewer.scene.pick(movement.position);
            if (!Cesium.defined(pickedFeature)) {
                clickHandler(movement);
                return;
            }

            //選擇功能（若是還沒有選擇）
            if (silhouetteGreen.selected[0] === pickedFeature) {
                return;
            }
            // 保存所選功能的原始顏色
            var highlightedFeature = silhouetteBlue.selected[0];
            if (pickedFeature === highlightedFeature) {
                silhouetteBlue.selected = [];
            }
            //突出顯示新選擇的功能
            silhouetteGreen.selected = [pickedFeature];
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
 var highlighted = {
        feature: undefined,
        originalColor: new Cesium.Color()
    };

    //將特徵懸停上色爲黃色。
    viewer.screenSpaceEventHandler.setInputAction(function onMouseMove(movement) {
        //若是之前突出顯示某個功能，請撤消突出顯示
        if (Cesium.defined(highlighted.feature)) {
            highlighted.feature.color = highlighted.originalColor;
            highlighted.feature = undefined;
        }
        // 選擇一個新功能
        var pickedFeature = viewer.scene.pick(movement.endPosition);
        if (!Cesium.defined(pickedFeature)) {
            bubbleDiv.style.display = 'none';
            return;
        }
        // 選擇了某項功能，所以請顯示其疊加內容
        bubbleDiv.style.display = 'block';
        bubbleDiv.style.bottom = viewer.canvas.clientHeight - movement.endPosition.y + 'px';
        bubbleDiv.style.left = movement.endPosition.x + 'px';
        var name = pickedFeature.getProperty('name');
        if (!Cesium.defined(name)) {
            name = pickedFeature.getProperty('id');
        }
        bubbleDiv.textContent = name;
        // 突出顯示該功能（若是還沒有選擇）
        if (pickedFeature !== selected.feature) {
            highlighted.feature = pickedFeature;
            Cesium.Color.clone(pickedFeature.color, highlighted.originalColor);
            pickedFeature.color = Cesium.Color.YELLOW;
        }
    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
}

 結果發現Mapbox 地圖加載也太慢了，不知道是咱們單位的網很差，仍是自己就慢。