Cesium加载视频

cesium加载视频

   <video id="trailer" style="display: none" controls loop preload="auto" autoplay="autoplay" >
      <source src="../../static/d.mp4" type="video/mp4">
  </video>

第一种加载方式

    //首先获取到视频元素
    var videoElement = document.getElementById('trailer');
    //在cesium中创建一个模型来承载视频，使得视频可以在该处进行播放
     var pArray = [
         116.34453261995247, 39.996079774527296, 14.546905094954552,
         116.34453261396283, 39.99601663806494, 14.526901883324383
     ];
     var instance = new Cesium.GeometryInstance({
         geometry: new Cesium.WallGeometry({
             positions: Cesium.Cartesian3.fromDegreesArrayHeights(pArray),
             minimumHeights: [10.740020872891446, 10.740020872891446]
         })
     });
         // //将该材质设置为视频，并给与模型
     var material = Cesium.Material.fromType('Image');
     material.uniforms.image = videoElement;

    var tileset=viewer.scene.primitives.add(new Cesium.Primitive({
        geometryInstances: instance,
        appearance: new Cesium.MaterialAppearance({
            closed: false,
            material: material
        })
    }));

     viewer.camera.setView({
         destination : Cesium.Cartesian3.fromDegrees(116.34453261995247, 39.996079774527296,300)
     });

第二种加载视频投影

var videoElement = document.getElementById('trailer');
viewer.entities.add(
{
     rectangle: {
     	coordinates:  Cesium.Rectangle.fromDegrees(position[0], position[3], position[2], position[1]),
        material: videoElement, 
        outline:true,
        outlineColor:Cesium.Color.BLACK.withAlpha(0.0),
        height : 1000.0*10,
        transparent : true
    },
    classificationType : Cesium.ClassificationType.BOTH
    });