cesium播放视频

实现原理：

html中声明一个vedio元素来承载视频，但是不必设置元素的宽高，然后再js中获取该元素，并把该元素赋值给一个实体的材质

此种方式适用于primitve方式加载的，官网的是加载到模型上，此后再做研究。

html中：

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

js中：

//首先获取到视频元素

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)
});