https://blog.csdn.net/D_Walker/article/details/82188514
1.加載線上cesium代碼
<link href="http://cesiumjs.org/releases/1.20/Build/Cesium/Widgets/widgets.css" rel="stylesheet"/>
<script src="http://cesiumjs.org/releases/1.20/Build/Cesium/Cesium.js"></script>
2.默認情況下所加載的GLTF模型朝向東方。但是我們可以通過Entity.orientation屬性指定一個四元組來控制模型的方向
var viewer = new Cesium.Viewer('cesiumContainer');
var position = Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706);
var heading = Cesium.Math.toRadians(45.0);
var pitch = Cesium.Math.toRadians(15.0);
var roll = Cesium.Math.toRadians(0.0);
var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, heading, pitch, roll);
var entity = viewer.entities.add({
position : position,
orientation : orientation,
model : {
uri : '../../SampleData/models/CesiumGround/Cesium_Ground.gltf'
}
});
viewer.trackedEntity = entity;
3.禁用默認的事件處理程序
var viewer = new Cesium.Viewer('cesiumContainer',{
baseLayerPicker : false,
imageryProvider : new Cesium.ArcGisMapServerImageryProvider({
url :'http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer'
})
});
var scene = viewer.scene;
var ellipsoid = viewer.scene.globe.ellipsoid; //獲取地球球體對象
//禁用默認的事件處理程序
//如果為真，則允許用戶旋轉相機。如果為假，相機將鎖定到當前標題。此標志僅適用於2D和3D
scene.screenSpaceCameraController.enableRotate = false;
//如果為真，則允許用戶平移地圖。如果為假，相機將保持鎖定在當前位置。此標志僅適用於2D和Columbus視圖模式
scene.screenSpaceCameraController.enableTranslate = false;
//如果為真，則允許用戶放大和縮小。如果為假，相機將鎖定到距離橢圓體的當前距離。
scene.screenSpaceCameraController.enableZoom = false;
//如果為真，則允許用戶傾斜相機。如果為假，相機將鎖定到當前標題。這個標志只適用於3D和哥倫布視圖。
scene.screenSpaceCameraController.enableTilt = false;
//如果為真，則允許用戶使用免費外觀。如果為假，攝像機視圖方向只能通過轉換或旋轉進行更改。此標志僅適用於3D和哥倫布視圖模式。
scene.screenSpaceCameraController.enableLook = false;
4.隱藏對應的實體模型
tileset.style = new Cesium.Cesium3DTileStyle({
color: {
conditions: [
["${ID} === '528851'||${ID} === '554086'", "rgba(${red}, ${green}, ${blue}, 0)"],
["true","rgba(${red}, ${green}, ${blue}, 1)"]
]
}
});
5.對cesium的幫組按鈕內容進行漢化
function navigationHelpButtonLang() {
var viewer = this.viewer;
if (viewer.navigationHelpButton) {
viewer.navigationHelpButton.viewModel.tooltip = "操作指南";
var clickHelper = viewer.navigationHelpButton.container.getElementsByClassName("cesium-click-navigation-help")[0];
var touchHelper = viewer.navigationHelpButton.container.getElementsByClassName("cesium-touch-navigation-help")[0];
var button = viewer.navigationHelpButton.container.getElementsByClassName("cesium-navigation-button-right")[0]
button.innerHTML = button.innerHTML.replace(">Touch", ">手勢");
button = viewer.navigationHelpButton.container.getElementsByClassName("cesium-navigation-button-left")[0]
button.innerHTML = button.innerHTML.replace(">Mouse", ">鼠標");
var click_help_pan = clickHelper.getElementsByClassName("cesium-navigation-help-pan")[0];
click_help_pan.innerHTML = "平移";
var click_help_pan_details = click_help_pan.parentNode.getElementsByClassName("cesium-navigation-help-details")[0];
click_help_pan_details.innerHTML = "按下左鍵 + 拖動";
var click_help_zoom = clickHelper.getElementsByClassName("cesium-navigation-help-zoom")[0];
click_help_zoom.innerHTML = "旋轉";
click_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "按下右鍵+拖動";
click_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[1].innerHTML = "";
var click_help_rotate = clickHelper.getElementsByClassName("cesium-navigation-help-rotate")[0];
click_help_rotate.innerHTML = "縮放";
click_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "滾動鼠標滾輪";
click_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[1].innerHTML = "";
//觸屏操作
var touch_help_pan = touchHelper.getElementsByClassName("cesium-navigation-help-pan")[0];
touch_help_pan.innerHTML = "平移";
touch_help_pan.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "單指拖動";
var touch_help_zoom = touchHelper.getElementsByClassName("cesium-navigation-help-zoom")[0];
touch_help_zoom.innerHTML = "縮放";
touch_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "雙指捏合";
var touch_help_tilt = touchHelper.getElementsByClassName("cesium-navigation-help-rotate")[0];
touch_help_tilt.innerHTML = "俯仰";
touch_help_tilt.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "雙指同向拖動";
var touch_help_rotate = touchHelper.getElementsByClassName("cesium-navigation-help-tilt")[0];
touch_help_rotate.innerHTML = "旋轉";
touch_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "雙指反向拖動";
}
}
6.更改cesium默認的鼠標操作以及對調試工具的設置
viewer.scene.screenSpaceCameraController.zoomEventTypes = [Cesium.CameraEventType.WHEEL, Cesium.CameraEventType.PINCH];
viewer.scene.screenSpaceCameraController.tiltEventTypes = [Cesium.CameraEventType.PINCH, Cesium.CameraEventType.RIGHT_DRAG];
var imageryProviderViewModels = viewer.baseLayerPicker.viewModel.imageryProviderViewModels;
viewer.baseLayerPicker.viewModel.selectedImagery = imageryProviderViewModels[3];
viewer.extend(Cesium.viewerCesiumInspectorMixin);
viewer.cesiumInspector.container.style.display = "none";
viewer.scene.debugShowFramesPerSecond = true;
document.addEventListener('keydown', function (event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
if (e) {
switch (e.keyCode) {
// case 82: //R鍵查看地形三角網
// if (viewer.cesiumInspector) {
// viewer.cesiumInspector.viewModel.wireframe = !viewer.cesiumInspector.viewModel.wireframe;
// }
// break;
case 70: //F鍵查看幀率
viewer.scene.debugShowFramesPerSecond = !viewer.scene.debugShowFramesPerSecond;
break;
default:
}
}
});
7.手機加載或者pad加載時提高畫質。
if(Cesium.FeatureDetection.supportsImageRenderingPixelated()){
viewer.resolutionScale = window.devicePixelRatio;
}
原文鏈接：https://blog.csdn.net/D_Walker/article/details/82188514