https://blog.csdn.net/D_Walker/article/details/82188514
1. The cesium loading the code line
<Link the href = "http://cesiumjs.org/releases/1.20/Build/Cesium/Widgets/widgets.css" the rel = "this stylesheet" />
<Script the src = "HTTP: // cesiumjs.org/releases/1.20/Build/Cesium/Cesium.js "> </ Script>
2. the default model GLTF case loaded toward the East. However, we can specify a quad model to control the direction attribute by Entity.orientation
var = new new Cesium.Viewer Viewer ( 'cesiumContainer');
var = Cesium.Cartesian3.fromDegrees position (-123.0744619, 44.0503706);
var = Cesium heading .Math.toRadians (45.0);
var Cesium.Math.toRadians Pitch = (15.0);
var = Cesium.Math.toRadians roll (0.0);
var = Cesium.Transforms.headingPitchRollQuaternion Orientation (position, heading, Pitch, roll);
Entity viewer.entities.add = var ({
position: position,
Model: {
URI: '../../SampleData/models/CesiumGround/Cesium_Ground.gltf'
}
});
viewer.trackedEntity = Entity;
3. disable the default event handler
var viewer = new Cesium.Viewer ( 'cesiumContainer ', {
baseLayerPicker: to false,
imageryProvider: new new Cesium.ArcGisMapServerImageryProvider ({
URL:' HTTP: //server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer '
})
});
var = viewer.scene SCENE;
var ellipsoid = viewer.scene.globe.ellipsoid; // get a sphere Earth objects
// disable the default event handler
// If true, it allows the user to rotate the camera. If false, the camera will lock into the current title. This mark applies only to 2D and 3D
= false scene.screenSpaceCameraController.enableRotate;
// If true, allows the user to pan the map. If false, the camera will remain locked at the current position. This flag only applies to 2D view mode and Columbus
scene.screenSpaceCameraController.enableTranslate = to false;
// If true, allows the user to zoom in and out. If false, the camera will lock the current distance from the ellipsoid.
= to false scene.screenSpaceCameraController.enableZoom;
// If true, it allows the user to tilt the camera. If false, the camera will lock into the current title. This flag only applies to Columbus and 3D views.
= false scene.screenSpaceCameraController.enableTilt;
// If true, allows users to use free appearance. If you can only make changes to false, or camera view direction by converting the rotation. This flag only applies to Columbus and 3D view mode.
= to false scene.screenSpaceCameraController.enableLook;
4. hides the corresponding mockup
tileset.style new 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 = "Press button + Drag";
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 = " dragging two fingers in the same direction";
var = touch_help_rotate touchHelper.getElementsByClassName ( "Cesium-Tilt-Navigation-Help") [0 ];
touch_help_rotate.innerHTML = "rotation";
touch_help_rotate.parentNode.getElementsByClassName ( "Help-cesium-Navigation-Details") [0] = .innerHTML "reverse dragging two fingers";
}
}
6. change the default mouse cesium and setting the operation of the debug tool
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. To view the frame rate
viewer.scene.debugShowFramesPerSecond = viewer.scene.debugShowFramesPerSecond;!
BREAK ;
default:
}
}
});
enhance the image quality or the loading pad 7. when the phone is loaded.
IF (Cesium.FeatureDetection.supportsImageRenderingPixelated ()) {
viewer.resolutionScale = window.devicePixelRatio;
}
description link: https: //blog.csdn.net/D_Walker/article/details/82188514