有可能利用视觉残留,不断的刷新 canvas 来显示一张图片吗?

[rabbbit]

把图片分成两半交替显示, 图像会闪动.

预览 https://aaron-bird.github.io/CanvasDemo/

代码 https://github.com/Aaron-Bird/CanvasDemo/blob/master/index.html

想问下为啥会闪? requestAnimationFrame 每秒绘制 60 帧,人眼不是 24 帧就够了吗?

[GiantHard]

我的猜测，多分几份，前后两帧之间最好有重叠部分，这样看起来会好一些。

[wjm2038]

可能就刚好在没绘制的时候看到了背景吧。。也有可能是没有真正的 60 帧？

[zhyl]

因为你不断 clearrect 整个画布

[lmmortal]

把页面背景调黑试试？

[oxoxoxox]

你是正常图片和白色背景交替？
你换成黑色背景再试试看呢

[Trim21]

24 帧的帧和帧之间也没有显示一次白色的背景啊…

[Cyron]

视频里添加一帧图片也可以明显看出来的，原理相同

[Cyron]

6 楼说的对，你这是相当于图片和背景交替每张 30 帧

[zhs227]

尝试了每个 rafj 里 hidden，下一个 raf 打开。也是一样闪。

[cjpjxjx]

个人猜测：电影 24 帧，每一帧都和前一帧相差不大，通过视觉残留就成了视频，在这个过程中并不会显示背景，然而这个图片虽然 60 帧，但确是图片和背景交替显示，图片有视觉残留，然而背景也会有视觉残留，不管是什么颜色

[SimonTart]

https://www.zhihu.com/question/21081976

[whileFalse]

你怎知胶片电影不闪呢？
电影院里 帧率 24，每帧时长 1/24，不闪
你的，帧率 30，每帧 1/60，闪
胶片电影，帧率 24，每帧时长<1/24，但注意，电影是要在夜里，用很高的亮度投射出来的，人的视野里只有电影。物体越亮，视觉暂留越久。如果你有 AMOLED 屏幕的手机，可以试试全屏后躲在被窝里看，效果会好一些。

[oyhw92]

背景放一张高斯模糊过的图片试试

[kerr92]

```js
canvasCtx.clearRect(0, 0, width, height);
canvasCtx.drawImage(...arr[i]);
```

理论上闪烁的原因在于你每次画新帧的时候都把前一帧清空了，如果基于 canvas 做动画，应该是直接用新帧覆盖前一帧，而不是清空重画。

[460881773]

楼上说的有道理

[koalli]

视觉残留是第一帧和第二帧比较相似的时候直接切换才会视觉残留，你这样等于第一帧是图，第二帧是清空的，无法视觉残留...

[Gimini]

实际上就是你背景和图片交替，各自 30 帧，视觉残留了图像也残留了背景

[wangjie]

盯着看一会儿后关掉那个页面看屏幕的那个地方还是在闪

[cent777]

@oyhw92 放高斯模糊出现了以前非主流头像的效果。。。

http://cloth.yxxurl.com/testpics/

[KevZhi]

人眼能感知到的闪烁频率 48HZ，初期模拟电视为了避免闪烁采用了隔行扫描，25p 的画面分成了 50i，所以不应该用 24hz，应该两倍或更高。
请参阅《现代电视技术》等基础课程