H5播放资源出现黑色边缘

[1214388532]

在源资源上是正常的。
针线动画.zip

在H5资源是播放后就出现了，是否是资源过于模糊导致通道丢失。

以下这份资源也是同样的问题

5.zip

[hujinliang]

尝试缩小展示的区域，缩小为原来的1/2试试看

[1214388532]

缩小原来的50%之后，黑边更明显了。

这是缩小50%后的资源：
50.zip

这是未缩放的资源：
5.zip

[hujinliang]

缩小原来的50%之后，黑边更明显了。

这是缩小50%后的资源： 50.zip

这是未缩放的资源： 5.zip

我的意思是绘制的尺寸缩小到原来的1/2，不是资源的尺寸，资源尺寸保持一致

[illusionspaces]

rgb区域和alpha区域设置为1:1

[LoveShoneLiu]

黑边问题怎么解决的呢？我们这边也遇到了

[LoveShoneLiu]

请问怎么解决呢？

黑边问题怎么解决的呢？我们这边也遇到了

官方有没有解决办法呢？期待回复

[gaoyuan123]

能提供一下原始图片素材吗？

[LoveShoneLiu]

能提供一下原始图片素材吗？

公司的素材，不太方便在这里上传，普通白色颜色色调的素材，在一个特定的场景的背景下，应该都会有这个问题

[Xiaolianmao]

这个问题我这边也复现了,安卓 ios都有. 请问有什么解决的办法吗

[hexleo]

这个问题我这边也复现了,安卓 ios都有. 请问有什么解决的办法吗

这个是在demo里能复现的吗？方法提高相视频素材，我看看

[Xiaolianmao]

[]
output.zip
(url)
这个是有复现的

[hexleo]

选择alpha 0.5确实会有这个问题，就看素材具体显示效果来定，有些素材细节特别多，0.5显示效果肯定没有1.0的效果好，可以对比细节比较少的的动画，效果0.5也可以接受，选择0.5主要是提高素材兼容性，分辨率太高解码器可能会解码失败

[wangbo122]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边
alpha 1 没有融合信息.zip
alpha 0.5 加上融合信息.zip
alpha 1 加上融合信息.zip

[hexleo]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

融合动画强制设置 alpha 0.5，因为需要预留遮罩的空间，目前没有优化的计划

[hujinliang]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

[wangbo122]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

素材没变，创建实例的时候缩小一半，黑边问题依然严重，使用的是alpha 0.5 加上融合信息.zip

这张图片是其他播放器放出的mp4效果

[hujinliang]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

素材没变，创建实例的时候缩小一半，黑边问题依然严重，使用的是alpha 0.5 加上融合信息.zip 这张图片是其他播放器放出的mp4效果

确实有这个问题，研究了下可能有2种可能：
1、素材生成或者浏览器端计算时产生了些精度误差，导致透明通道和颜色通道无法准确重叠；
2、浏览器端渲染时产生了锯齿；
暂时还没有好的方案来解决

[hujinliang]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

素材没变，创建实例的时候缩小一半，黑边问题依然严重，使用的是alpha 0.5 加上融合信息.zip 这张图片是其他播放器放出的mp4效果

确实有这个问题，研究了下可能有2种可能： 1、素材生成或者浏览器端计算时产生了些精度误差，导致透明通道和颜色通道无法准确重叠； 2、浏览器端渲染时产生了锯齿； 暂时还没有好的方案来解决

可以用css transform: scale(0.5)来将渲染容器缩小一点，这样锯齿没有那么明显了，可能效果会好一点

[wangbo122]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

素材没变，创建实例的时候缩小一半，黑边问题依然严重，使用的是alpha 0.5 加上融合信息.zip 这张图片是其他播放器放出的mp4效果

确实有这个问题，研究了下可能有2种可能： 1、素材生成或者浏览器端计算时产生了些精度误差，导致透明通道和颜色通道无法准确重叠； 2、浏览器端渲染时产生了锯齿； 暂时还没有好的方案来解决

可以用css transform: scale(0.5)来将渲染容器缩小一点，这样锯齿没有那么明显了，可能效果会好一点

还是会有锯齿效果，个人感觉像是浏览器渲染的问题，因为我浏览器放大后，看到的锯齿更严重了。

[Xiaolianmao]

@hexleo

在有类似需要添加融合信息,需要有交互性的动画时,建议用其他的动画渲染器来完成,比如PAG.
VAP用于大的复杂的纯动画展示就行.

[wangbo122]

@hexleo 素材不加融合信息的时候，选择alpha 1的确没有黑边，但是加融合信息之后无论是alpha 0.5 或者 1 都会有黑边 alpha 1 没有融合信息.zip alpha 0.5 加上融合信息.zip alpha 1 加上融合信息.zip

尝试绘制区域缩小到原来的一半，有效果吗，素材不用改，在创建实例的时候传入的宽高按比例缩小下

素材没变，创建实例的时候缩小一半，黑边问题依然严重，使用的是alpha 0.5 加上融合信息.zip 这张图片是其他播放器放出的mp4效果

确实有这个问题，研究了下可能有2种可能： 1、素材生成或者浏览器端计算时产生了些精度误差，导致透明通道和颜色通道无法准确重叠； 2、浏览器端渲染时产生了锯齿； 暂时还没有好的方案来解决

可以用css transform: scale(0.5)来将渲染容器缩小一点，这样锯齿没有那么明显了，可能效果会好一点

我把素材裁剪了一下，也会有黑边，感觉可能是精度误差

[Huang980621]

大佬，H5怎么用这个插件能给个例子吗

[wangbo122]

我这边写了个demo，发现在web端，
视频信息和透明通道信息为1:1时，显示正常
比例为1:0.5时，缩放比例计算uv坐标时，就会产生黑边，
能否将vap_tools导出的视频强制改为比例1:1的
或者说出一个选项，在制作视频时，能够选择视频信息和透明通道比例