Cesium 案例（四） Video
Sandcastle-header.js存储在Cesium中Apps/Sandcastle/Sandcastle-header.js的位置，该js文件时用于创建下拉框和带选中框的按钮，引入该文件后，就会有一个Sandcastle全局对象，包含着很多方法。 // videoElement = document.getElementById("trailer");videoElement = "../images/_DSC0718-239.jpg";（视频导入有问题，尝试用图片替代，完成替代） Cesium.Ion.defaultAccessToken = "token"; const viewer = new Cesium.Viewer("cesiumContainer", { showRenderLoopErrors: false, //如果为 true，如果出现渲染循环错误， //此小部件将自动向用户显示包含错误的 HTML 面板。 shouldAnimate: true, }); const sphere = viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees( 104, 31.75, 1000 //高度 可选 米为单位 ), //从以度为单位的经度和纬度值返回 Cartesian3 位置。 ellipsoid: { radii: new Cesium.Cartesian3(1000, 1000, 1000), //指定椭球半径的 Cartesian3 属性。 material: videoElement, }, }); viewer.trackedEntity = sphere; //获取或设置相机当前正在跟踪的实体实例。let synchronizer;
Sandcastle.addToggleButton( //外部文件引入用于进行ui设计 "Clock synchronization", false, function (checked) { if (Cesium.defined(synchronizer)) { synchronizer = synchronizer.destroy(); videoElement.playbackRate = 1.0; return; } synchronizer = new Cesium.VideoSynchronizer({ clock: viewer.clock, element: videoElement, }); } ); let isRepeating = true; Sandcastle.addToggleButton( "Image Repeat", isRepeating, function (checked) { isRepeating = checked; } );
sphere.ellipsoid.material.repeat = new Cesium.CallbackProperty(function ( time, result ) { if (!Cesium.defined(result)) { result = new Cesium.Cartesian2(); } if (isRepeating) { result.x = 8; result.y = 2; } else { result.x = 1; result.y = 1; } return result; }, false);
// Like Image, the video element doesn't have to be part of the DOM or // otherwise on the screen to be used as a texture. Sandcastle.addToggleButton("Video Overlay", true, function (checked) { if (checked) { videoElement.style.display = ""; } else { videoElement.style.display = "none"; } });
// Older browsers do not support WebGL video textures, // put up a friendly error message indicating such. viewer.scene.renderError.addEventListener(function () { if (!videoElement.paused) { videoElement.pause(); } viewer.cesiumWidget.showErrorPanel( "This browser does not support cross-origin WebGL video textures.", "", "" ); });
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！
页:
[1]