首页 / 浏览问题 / 其他 / 问题详情
WebGL视频投放单独运行无法在chrome中显示
2EXP 2020年01月10日
使用产品:supermap iClient3D for WebGL 操作系统win10 x64

1、我直接运行localhost:8080/examples/projectionImage.html,在浏览器中可以直接投放视频,但是在chrome中视频无法播放,视频画面为黑色,同时控制台会输出:256WebGL: INVALID_VALUE: tex(Sub)Image2D: video visible size is empty

但是在firefox浏览器中就可以正常显示

2、我从webGL首页进去,找到示范程序,再找到视频投放则不会出现这种问题,即所有浏览器都可以投放视频。

同时,我仿照例程写的视频投放程序也出现这种问题。

请问是我单个html文件少加载了什么文件或库了吗?

1个回答

您好,黑色是因为视频没有自动播放,您在js中添加这段代码:

function toggleSound() { 
   var music = document.getElementById("trailer");//获取ID
   if (music.paused) {//判读是否播放
      music.paused=false; music.play();//没有就播放
      }
}
setInterval("toggleSound()",1);
882EXP 2020年01月10日

您好,我加入以上代码会报错找不到toggleSound,直接运行toggleSound();函数就可以播放了,但也有几次会出现播放黑色的现象。

现在我将video设置为静音muted模式,它也可以播放运行,代码如下,

<video id="trailer" style="display:none" muted autoplay loop crossorigin controls>

但当我在自己的代码中添加静音属性或添加上述代码,在chrome中没有黑色视频,但也没有播放视频,只有绘制出来的视频投放线。部分代码如下:

        <div id="toolbar">

            <video id="trailer" style="display:none" muted autoplay loop crossorigin controls>

                <source src="media/video.mp4" type="video/mp4">

            </video>

        </div>

js代码:

var projectionImage = new Cesium.ProjectionImage(scene);

            var wgsPosition = scene.camera.positionCartographic;

            var longitude = Cesium.Math.toDegrees(wgsPosition.longitude);

            var latitude = Cesium.Math.toDegrees(wgsPosition.latitude);

            var height = wgsPosition.height;

            projectionImage.setDistDirByPoint([longitude, latitude, height]);

            projectionImage.distance = 200;     //观测距离

            projectionImage.viewPosition = [longitude, latitude, height];   //设置起始位置

            projectionImage.direction = 180;   

            projectionImage.pitch = -18;   

            projectionImage.horizontalFov = 30;  

            projectionImage.verticalFov = 10;   

            projectionImage.hintLineColor = Cesium.Color.DODGERBLUE;

            projectionImage.setImage({ 

                video: videoElement

            });

            projectionImage.build();

请问是我写的有问题吗?

已经解决了吗? 视频有声音,但是黑屏
...