小程序
小游戏
企业微信
微信支付
扫描小程序码分享
小程序Canvas WebGL 在安卓机型上背景黑色,无法透明,请问有解决方案吗?不透明无法实现摄像头AR效果。编辑器里透明,和真机差距那么多,太坑了
2 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
还有问题的可以试下这个代码,我是从 threeJS 源码拿出来的,在几台安卓机器上都可以透明,不加则不透明。webGLCanvasId 设置你们的ID。如果用 threeJS,canvas 和 glContext 要传到 threeJS 里面。
wx.createSelectorQuery()
.select(`#${webGLCanvasId}`)
.node()
.exec((res) => {
const canvas = res[0].node;
const glContext = canvas.getContext('webgl', {
alpha: true,
depth: true,
stencil: true,
antialias: true,
premultipliedAlpha: true,
preserveDrawingBuffer: false,
powerPreference: 'default',
failIfMajorPerformanceCaveat: false,
xrCompatible: true
});
// 安卓手机需要调用这个来设置透明
glContext.clearColor(0, 0, 0, 0);
glContext.clear(glContext.COLOR_BUFFER_BIT);
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
微信升级到7.0.7版本,我也碰到过这个坑
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
还有问题的可以试下这个代码,我是从 threeJS 源码拿出来的,在几台安卓机器上都可以透明,不加则不透明。webGLCanvasId 设置你们的ID。如果用 threeJS,canvas 和 glContext 要传到 threeJS 里面。
wx.createSelectorQuery()
.select(`#${webGLCanvasId}`)
.node()
.exec((res) => {
const canvas = res[0].node;
const glContext = canvas.getContext('webgl', {
alpha: true,
depth: true,
stencil: true,
antialias: true,
premultipliedAlpha: true,
preserveDrawingBuffer: false,
powerPreference: 'default',
failIfMajorPerformanceCaveat: false,
xrCompatible: true
});
// 安卓手机需要调用这个来设置透明
glContext.clearColor(0, 0, 0, 0);
glContext.clear(glContext.COLOR_BUFFER_BIT);
});
微信升级到7.0.7版本,我也碰到过这个坑