mark 目前测了很多,只有华为某些机型有这个问题。手头的mate40e最大在 1.8 左右,1.9 就不行了,也没找到这个上界是怎么来的。 this.renderer.setPixelRatio(1.8) this.renderer.setSize(window.innerWidth, window.innerHeight) 1.8 对应 648*1274 1.9 对应 684*1345 略微测了下,宽 660 OK,680 就不行了;高 1290 OK,1300 不行。很迷惑。
wx.createMediaRecorder 在使用three.js 后 ,启动失败问题描述 项目主要是把在把canvas录制成为视频 用到了 three.js 以及 wx.createMediaRecorder() ,问题主要是 部分手机 出现视频录制启动器启动失败 以及 录制出来的视频是全黑的 经过测试调整发现是three.js 设置引发的录制器bug initThree(){ ........ // 初始化camera scene reneder等 // renderer.setPixelRatio(1); renderer.setSize(canvas.width , canvas.height); // 1. 如果设置renderer宽高 超过 canvas 宽高 mediaRecord.start() 会启动失败 // 2. 如果设置 如果设置renderer.setPixelRatio() 为 2 以上 部分手机会导致录制出来的视频黑屏 或者 mediaRecord.start() 会启动失败 } // 创建启动器 createRecorder(canvas, fps = 30) { try { let OP = { 'fps': fps, 'gop': 12, 'timeUpdateInterval': fps, 'cumulativeStamp': false, 'videoBitsPerSecond': 3000 }; console.log(this.videoRecorder, 'videoRecorder info'); if(!this.videoRecorder) { this.videoRecorder = wx.createMediaRecorder(canvas, OP); } this.videoRecorder.on('start', () => { console.log('录制开始') }); } catch (err) { console.log(err) } } // 开始录制 async start(music) { if (this.videoRecorder) { console.log(this.videoRecorder.start,'this.videoRecorder.start__') await this.videoRecorder.start().catch(err => { console.log('recorder启动失败', err); wx.showModal({ title: '提示', content: '录像机启动失败,请重新打开该页面', showCancel: false, success (res) { wx.redirectTo({ url: '/pages/index/index', }) } }) }) this.recordStartTime = +new Date() this.recording = true this._started = true } } 出现问题的手机 华为鸿蒙系列 出现录制出来的视频黑屏的几率很大ColorOS 出现启动器启动失败 或者 视频黑屏
2024-12-26微信这个原生的 video 做了很多修改,没找到转 Three-X 的方法Three-X 里面做了一个 video 的 Custom Component,需要在 app.json 或者 index.json 里面用 usingComponent 注册,注册之后,wxml 里面的 video 就会被 Three-X 的 video 替换Custom Video Component 在这里:https://gitee.com/threejs/three-weixin-demo/blob/36eedb22a3496c338b49c53549d7915e7990b273/three/components/video/video.js#usingComponent 注册示例:https://gitee.com/threejs/three-douyin-demo/blob/master/webgl/webgl_materials_video.json替换之后的 video 其实底层是用了 wx.VideoDecoder解码出来的直接是 Uint8Array,按照 demo 是塞给 THREE.VideoTexturehttps://gitee.com/threejs/three-douyin-demo/blob/master/webgl/webgl_materials_video.js结果报了一个 texImage2D invalid pixel 的错,遂改成用 THREE.DataTexture
小程序中使用three.js中的如何使用Three.VideoTexture?在webgl中,想实现一个使用纹理来播放一个视频,使用了Three.VideoTexture方法,但是没有效果。 [图片] 获取video 节点无法回去。 [图片]
2024-12-02