Skip to content

Commit a863822

Browse files
ParnDeedlitParnDeedlit
committed
【站点】【实例】【新增新版本的Cesium1.84的示例】
1 parent 0a5b70c commit a863822

75 files changed

Lines changed: 6493 additions & 1 deletion

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎src/service/docs/~$$编译流程.~vsdx‎

-4 KB
Binary file not shown.

‎src/service/docs/编译流程.pdf‎

179 KB
Binary file not shown.

‎src/service/docs/编译流程.png‎

197 KB
Loading

‎src/service/docs/编译流程.vsdx‎

2.43 KB
Binary file not shown.

‎website/public/static/demo/cesium-new/example/analysis/analysis-animation.htm‎

Lines changed: 266 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,266 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
4+
<head>
5+
<meta charset='utf-8' />
6+
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
7+
<title>动画漫游</title>
8+
<!--引入第三方的jquery脚本库-->
9+
<script include="jquery" src="./static/libs/include-lib-local.js"></script>
10+
<script src="./static/libs/include-cesium-local.js"></script>
11+
<!--当前示例页面样式表引用-->
12+
<link rel="stylesheet" href="./static/demo/cesium/style.css" />
13+
<script>
14+
'use strict';
15+
16+
//定义三维视图的主要类
17+
var webGlobe;
18+
//定义动画漫游对象、路径；
19+
var animation, positions;
20+
21+
//地图初始化函数
22+
function init() {
23+
//构造三维视图类（视图容器div的id，三维视图设置参数）
24+
webGlobe = new Cesium.WebSceneControl('GlobeView', {
25+
terrainExaggeration: 1,
26+
});
27+
28+
//构造第三方图层对象
29+
var thirdPartyLayer = new CesiumZondy.Layer.ThirdPartyLayer({
30+
viewer: webGlobe.viewer
31+
});
32+
//加载天地图
33+
var tdtLayer = thirdPartyLayer.appendTDTuMap({
34+
//天地图经纬度数据
35+
url: 'http://t0.tianditu.com/DataServer?T=vec_c&X={x}&Y={y}&L={l}',
36+
//开发token （请到天地图官网申请自己的开发token，自带token仅做功能验证随时可能失效）
37+
token: "9c157e9585486c02edf817d2ecbc7752",
38+
//地图类型 'vec'矢量 'img'影像 'ter'地形
39+
ptype: "img"
40+
});
41+
42+
//视点跳转（经度，纬度，视角高度，方位角，俯仰角，翻滚角）
43+
webGlobe.flyToEx(117.213063, 31.812956, {
44+
height: 200,
45+
heading: 90,
46+
pitch: 0,
47+
roll: 0
48+
});
49+
50+
//显示鼠标位置控件
51+
webGlobe.showPosition('coordinate_location');
52+
//显示导航控件（罗盘、比例尺、场景导航）
53+
webGlobe.createNavigationTool({
54+
enableCompass: true,
55+
enableZoomControls: true,
56+
enableDistanceLegend: true
57+
});
58+
59+
var viewer = webGlobe.viewer;
60+
var scene = webGlobe.scene;
61+
//避免穿透地形
62+
var controller = scene.screenSpaceCameraController;
63+
controller.minimumZoomDistance = 3000;
64+
scene.camera.enableTerrainAdjustmentWhenLoading = true; //避免穿透地形
65+
66+
//漫游路径
67+
positions = Cesium.Cartesian3.fromDegreesArrayHeights([
68+
117.213063, 31.812956, 500, 117.213162, 31.812389, 500, 117.212929, 31.812056, 500, 117.213275, 31.811582, 500,
69+
117.21348, 31.811513, 500, 117.214141, 31.811682, 500, 117.21497, 31.811691, 500, 117.216318, 31.811454, 500,
70+
117.216962, 31.812037, 500, 117.217893, 31.812298, 500, 117.218607, 31.811488, 500, 117.219466, 31.810935, 500,
71+
117.224439, 31.810929, 500, 117.225266, 31.811119, 500, 117.225308, 31.81131, 500, 117.224819, 31.811724, 500,
72+
117.225189, 31.811928, 500, 117.225676, 31.811624, 500, 117.225843, 31.811943, 500, 117.22625, 31.812183, 500,
73+
117.226292, 31.81281, 500, 117.225888, 31.813287, 500, 117.226093, 31.814059, 500, 117.22564, 31.814582, 500,
74+
117.225953, 31.814731, 500, 117.225611, 31.814954, 500, 117.22576, 31.815233, 500, 117.224073, 31.816329, 500,
75+
117.223694, 31.81627, 500, 117.222769, 31.817007, 500, 117.222259, 31.816871, 500, 117.221922, 31.816707, 500,
76+
117.221653, 31.816788, 500, 117.22151, 31.817002, 500, 117.221039, 31.816891, 500, 117.220395, 31.816352, 500,
77+
117.220166, 31.815734, 500, 117.219804, 31.815607, 500, 117.219461, 31.815122, 500, 117.21878, 31.814846, 500,
78+
117.218297, 31.815275, 500, 117.217975, 31.815172, 500, 117.217142, 31.815229, 500, 117.216753, 31.815124, 500,
79+
117.216652, 31.814308, 500, 117.215726, 31.814049, 500, 117.214769, 31.813517, 500, 117.214111, 31.813717, 500,
80+
117.213552, 31.814099, 500, 117.213024, 31.813954, 500, 117.212897, 31.813892, 500, 117.213224, 31.813681, 500,
81+
117.212788, 31.813147, 500, 117.212928, 31.813018, 500, 117.213063, 31.812956, 500,
82+
]);
83+
84+
//初始化高级分析功能管理类
85+
var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({
86+
viewer: webGlobe.viewer
87+
});
88+
//创建动画漫游对象
89+
animation = advancedAnalysisManager.createAnimation({
90+
exHeight: 9,
91+
isLoop: false,
92+
//漫游模型url
93+
modelUrl: './static/data/model/WuRenJi.glb',
94+
//完成动画漫游回调函数
95+
complete: function() {
96+
alert('完毕');
97+
}
98+
});
99+
100+
//设置路径
101+
animation.positions = positions;
102+
//漫游方式：1-跟随、2-锁定第一视角、3-上帝视角
103+
animation.animationType = 2;
104+
//漫游速度
105+
animation.speed = 1;
106+
107+
//设置动画漫游参数
108+
var viewModel = {
109+
pitch: 0, //俯仰角
110+
heading: 90, //方位角
111+
range: 0, //距离
112+
speed: 1 //速度
113+
};
114+
Cesium.knockout.track(viewModel);
115+
//与界面UI绑定
116+
var toolbar = document.getElementById('toolbar');
117+
Cesium.knockout.applyBindings(viewModel, toolbar);
118+
119+
function subscribeParameter(name) {
120+
Cesium.knockout.getObservable(viewModel, name).subscribe(
121+
function(newValue) {
122+
if (name === 'pitch') {
123+
//animation.offsetZ = newValue;
124+
//animation.pitch = Cesium.Math.toRadians(parseInt(newValue));
125+
animation.pitch = Cesium.Math.toRadians(parseInt(newValue)); //俯仰角
126+
} else if (name === 'range') {
127+
animation.range = parseFloat(newValue); //距离
128+
129+
} else if (name === 'heading') {
130+
animation.heading = Cesium.Math.toRadians(parseInt(newValue)); //方位角
131+
} else if (name === 'speed') {
132+
animation.speedupFactor = parseFloat(newValue); //速度
133+
}
134+
}
135+
);
136+
}
137+
subscribeParameter('pitch');
138+
subscribeParameter('heading');
139+
subscribeParameter('range');
140+
subscribeParameter('speed');
141+
142+
/*
143+
function callBack(arg) {
144+
//绘制路径点
145+
positions = arg._points;
146+
//设置漫游路径
147+
animation.positions = positions;
148+
//显示路径
149+
animation.animationModel.path.show._value = !animation.animationModel.path.show._value;
150+
//开始漫游
151+
animation.start();
152+
//漫游速度
153+
animation.speed = 1;
154+
//漫游方式：1-跟随、2-锁定第一视角、3-上帝视角
155+
animation.animationType = 2;
156+
157+
}
158+
//创建交互绘制工具
159+
var drawPolygon = new Cesium.DrawPolygonTool(webGlobe.viewer, callBack);
160+
drawPolygon.activeTool();
161+
*/
162+
}
163+
164+
function start() {
165+
//开始漫游
166+
animation.start();
167+
//显示路径
168+
animation._animationModel._path._show._value = true;
169+
}
170+
171+
function pause() {
172+
//暂停漫游
173+
animation.pause = true;
174+
}
175+
176+
function stop() {
177+
//停止漫游
178+
animation.stop();
179+
}
180+
181+
function changeType() {
182+
var aType = document.getElementsByName("animationType")
183+
for (var i = 0; i < aType.length; i++) {
184+
if (aType[i].checked) {
185+
if (Number(aType[i].value) == 2) {
186+
document.getElementById("pitch").style.display = "";
187+
document.getElementById("heading").style.display = "";
188+
} else {
189+
document.getElementById("pitch").style.display = 'none';
190+
document.getElementById("heading").style.display = 'none';
191+
}
192+
//设置漫游方式：1-跟随、2-锁定第一视角、3-上帝视角
193+
animation.animationType = Number(aType[i].value);
194+
}
195+
}
196+
}
197+
</script>
198+
</head>
199+
200+
<body onload="init()">
201+
<div id="GlobeView">
202+
<div class="message">
203+
<button id="start" onclick="start()">开始漫游</button>
204+
<button id="pause" onclick="pause()">暂停漫游</button>
205+
<button id="stop" onclick="stop()">结束漫游</button>
206+
</div>
207+
</div>
208+
<!--坐标容器-->
209+
<div id="coordinateDiv" class="coordinateClass">
210+
<label id="coordinate_location"></label>
211+
<label id="coordinate_height"></label>
212+
</div>
213+
214+
<div class="message" id="toolbar" style="left: unset; top: 40px; ">
215+
<table>
216+
<tbody>
217+
<tr>
218+
<td>漫游方式</td>
219+
<td>
220+
<label><input style="float:unset; width:unset;" name="animationType" type="radio" value="1"
221+
onclick="changeType()" />跟随</label>
222+
<label><input style="float:unset; width:unset;" name="animationType" type="radio" checked
223+
value="2" onclick="changeType()" />锁定第一视角</label>
224+
<label><input style="float:unset; width:unset;" name="animationType" type="radio" value="3"
225+
onclick="changeType()" />上帝视角</label>
226+
227+
</td>
228+
</tr>
229+
<tr>
230+
<td></td>
231+
</tr>
232+
<tr id="pitch" style="display:''">
233+
<td>俯仰角</td>
234+
<td>
235+
<input type="range" min="-180" max="180" value="0" step="1" data-bind="value: pitch, valueUpdate: 'input'" size="20">
236+
<input type="number" size="2" data-bind="value: pitch">
237+
</td>
238+
</tr>
239+
<tr id="heading" style="display:''">
240+
<td>方位角</td>
241+
<td>
242+
<input type="range" min="-180" max="180" value="90" step="1" data-bind="value: heading, valueUpdate: 'input'">
243+
<input type="number" size="2" data-bind="value: heading">
244+
</td>
245+
</tr>
246+
<tr>
247+
<td>距离</td>
248+
<td>
249+
<input type="range" min="0.1" max="200" step="1" data-bind="value: range, valueUpdate: 'input'">
250+
<input type="number" size="2" data-bind="value: range">
251+
</td>
252+
</tr>
253+
<tr>
254+
<td>播放速度</td>
255+
<td>
256+
<input type="range" min="1" max="10" step="1" data-bind="value: speed, valueUpdate: 'input'">
257+
<input type="number" size="2" data-bind="value: speed">
258+
</td>
259+
</tr>
260+
</tbody>
261+
</table>
262+
</div>
263+
264+
</body>
265+
266+
</html>

‎website/public/static/demo/cesium-new/example/analysis/analysis-aspectAnalysis-normal.htm‎

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
6+
<title>坡向分析</title>
7+
<!--引入第三方的jquery脚本库-->
8+
<script include="jquery" src="./static/libs/include-lib-local.js"></script>
9+
<script src="./static/libs/include-cesium-local.js"></script>
10+
<!--当前示例页面样式表引用-->
11+
<link rel="stylesheet" href="./static/demo/cesium/style.css" />
12+
<script>
13+
'use strict';
14+
//定义三维视图的主要类
15+
var webGlobe, aspectAnalysis, drawElement, viewer;
16+
//地图初始化函数
17+
function init() {
18+
//构造三维视图类（视图容器div的id，三维视图设置参数）
19+
webGlobe = new Cesium.WebSceneControl('GlobeView', {
20+
terrainExaggeration: 1
21+
});
22+
viewer = webGlobe.viewer;
23+
//构造第三方图层对象
24+
var thirdPartyLayer = new CesiumZondy.Layer.ThirdPartyLayer({
25+
viewer: webGlobe.viewer
26+
});
27+
//加载天地图
28+
var tdtLayer = thirdPartyLayer.appendTDTuMap({
29+
//天地图经纬度数据
30+
url: 'http://t0.tianditu.com/DataServer?T=vec_c&X={x}&Y={y}&L={l}',
31+
//开发token （请到天地图官网申请自己的开发token，自带token仅做功能验证随时可能失效）
32+
token: '9c157e9585486c02edf817d2ecbc7752',
33+
//地图类型 'vec'矢量 'img'影像 'ter'地形
34+
ptype: 'img'
35+
});
36+
37+
//构造地形图层管理类
38+
var terrain = new CesiumZondy.Layer.TerrainLayer({
39+
viewer: webGlobe.viewer
40+
});
41+
//加载三维地形地图文档（服务地址，配置参数）
42+
var { protocol, ip, port } = window.webclient;
43+
var terrainlayer = terrain.append(`${protocol}://${ip}:${port}/igs/rest/g3d/terrain`, {
44+
requestVertexNormals: true
45+
});
46+
//初始化视图功能管理类
47+
var sceneManager = new CesiumZondy.Manager.SceneManager({
48+
viewer: webGlobe.viewer
49+
});
50+
//视点跳转
51+
sceneManager.flyToEx(120.9819, 23.5307, {
52+
height: 9161,
53+
heading: 30,
54+
pitch: -10,
55+
roll: 0
56+
});
57+
58+
let colors = ['#2d41d0', '#2d94d0', '#2dd0aa', '#2dd032', '#d0c32d', '#d03c2d'];
59+
// let steps = [0.05, 0.25, 0.45, 0.65, 0.85, 0.95];
60+
61+
drawElement = new Cesium.DrawElement(viewer);
62+
drawElement.startDrawingPolygon({
63+
// 绘制完成回调函数
64+
callback: (positions) => {
65+
remove();
66+
67+
aspectAnalysis = new Cesium.TerrainAnalyse(viewer, {
68+
aspectRampColor: colors,
69+
// aspectRamp: steps
70+
});
71+
72+
viewer.scene.globe.enableLighting = true;
73+
// 调高亮度
74+
const stages = viewer.scene.postProcessStages;
75+
viewer.scene.brightness = stages.add(new Cesium.PostProcessStageLibrary.createBrightnessStage());
76+
viewer.scene.brightness.enabled = true;
77+
viewer.scene.brightness.uniforms.brightness = 1.2;
78+
79+
aspectAnalysis.enableContour(false);
80+
aspectAnalysis.updateMaterial('aspect');
81+
aspectAnalysis.changeAnalyseArea(positions);
82+
}
83+
});
84+
}
85+
86+
function remove() {
87+
if (aspectAnalysis) {
88+
aspectAnalysis.updateMaterial('none');
89+
aspectAnalysis = null;
90+
}
91+
if (drawElement) {
92+
drawElement.stopDrawing();
93+
drawElement = null;
94+
}
95+
96+
if (viewer.scene.brightness) {
97+
viewer.scene.globe.enableLighting = false;
98+
viewer.scene.brightness.enabled = false;
99+
}
100+
}
101+
</script>
102+
</head>
103+
104+
<body onload="init()">
105+
<div id="GlobeView"></div>
106+
</body>
107+
</html>

0 commit comments

Comments
 (0)