Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/javascript
接下来将添加一些更多的正确的时间和空间设置到Viewer中。涉及到与viewer.scene进行交互,该类控制了viewer中的全部图形元素。html
// Enable lighting based on sun/moon positions viewer.scene.globe.enableLighting = true;
按照以上配置,咱们scene(场景)中的光照将会随着天天时间的变化而变化。若是你zoom out,你就会看到一部分数字地球位于黑暗之中,由于模拟真实的地球,太阳只能照射到地球的一部分。java
这些是在场景中定位和定位Cesium objects所必需的基本类型,而且有许多有用的转换方法。请参阅每种类型的文档以了解更多信息。安全
如今让咱们把相机定位在咱们数据所在的NYC(纽约)的场景中。框架
相机是viewer.scene中的属性,用来控制当前可见的域。咱们能够经过直接设置它的位置和方向来控制相机,或者经过使用Cesium提供的API来控制相机,它被设计成指定相机的位置和方向随时间的变化。ide
一些最经常使用的方法以下:oop
进一步得到API功能,看看这些相机演示:测试
让咱们尝试一种方法将相机跳转到纽约。使用camera.setView()初始化view,使用Cartesian3和HeadingpitchRoll指定相机的位置和方向:动画
// Create an initial camera view var initialPosition = new Cesium.Cartesian3.fromDegrees(-73.998114468289017509, 40.674512895646692812, 2631.082799425431); var initialOrientation = new Cesium.HeadingPitchRoll.fromDegrees(7.1077496389876024807, -31.987223091598949054, 0.025883251314954971306); var homeCameraView = { destination : initialPosition, orientation : { heading : initialOrientation.heading, pitch : initialOrientation.pitch, roll : initialOrientation.roll } }; // Set the initial view viewer.scene.camera.setView(homeCameraView);
相机如今被定位和定向以俯瞰曼哈顿,而且咱们的视图参数被保存在一个对象中,咱们能够将其传递给其余相机方法。ui
实际上,咱们可使用这个相同的视角来更新按下home按钮的效果。咱们没必要让它从远处返回地球的默认视角,咱们能够重写按钮,使咱们看到曼哈顿的初始视角。咱们能够经过添加几个选项来调整动画,而后添加一个取消默认航班的事件侦听器,并调用**FlyTo()**咱们的Home视角:
// Add some camera flight animation options homeCameraView.duration = 2.0; homeCameraView.maximumHeight = 2000; homeCameraView.pitchAdjustHeight = 2000; homeCameraView.endTransform = Cesium.Matrix4.IDENTITY; // Override the default home button viewer.homeButton.viewModel.command.beforeExecute.addEventListener(function (e) { e.cancel = true; viewer.scene.camera.flyTo(homeCameraView); });
更多关于基本相机控制,请访问咱们的Camera Tutorial。
接下来,咱们配置viewer的Clock和Timline来控制scene的时间进度。
这里是clock的相关API
当使用特定时间时,Cesium使用JulandDATE类型,它存储了1月1日中午以来的天数-4712(公元前4713年)。为了提升精度,该类将日期和秒的所有部分存储在单独的组件中。为了计算安全和表明跳跃秒,日期老是存储在国际原子时间标准中。
下面是咱们如何设置场景时间选项的例子:
// Set up clock and timeline. viewer.clock.shouldAnimate = true; // make the animation play when the viewer starts viewer.clock.startTime = Cesium.JulianDate.fromIso8601("2017-07-11T16:00:00Z"); viewer.clock.stopTime = Cesium.JulianDate.fromIso8601("2017-07-11T16:20:00Z"); viewer.clock.currentTime = Cesium.JulianDate.fromIso8601("2017-07-11T16:00:00Z"); viewer.clock.multiplier = 2; // sets a speedup viewer.clock.clockStep = Cesium.ClockStep.SYSTEM_CLOCK_MULTIPLIER; // tick computation mode viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; // loop at the end viewer.timeline.zoomTo(viewer.clock.startTime, viewer.clock.stopTime); // set visible range
这设置场景动画的速率、开始和中止时间,并告诉时钟在到达中止时间时循环回到开始。它还将时间线控件设置为适当的时间范围。看看这个时钟示例代码来测试时钟设置。
这是咱们的初始场景配置!如今,当你运行你的应用程序时,你应该看到如下内容:
Cesium中文网交流QQ群:807482793
Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/