如何使用html5的canvas实现图片转素描的效果-创新互联

如何使用html5的canvas实现图片转素描的效果？针对这个问题，这篇文章详细介绍了相对应的分析和解答，希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

素描滤镜原理：
最基础的算法就是：
1、去色；（去色公式：gray = 0.3 red + 0.59 green + 0.11 * blue）
2、复制去色图层，并且反色；
3、对反色图像进行高斯模糊；
4、模糊后的图像叠加模式选择颜色减淡效果。
减淡公式：C =MIN( A +（A×B）/（255-B）,255)，其中C为混合结果，A为去色后的像素点，B为高斯模糊后的像素点。

先看看效果对比图：

sigma可以调节效果。

代码实例：

    
        
        
    
    
        

            
            

            
            
            sigma：0.8
            

            下载
        
        
        

        
        
    

关于如何使用html5的canvas实现图片转素描的效果问题的解答就分享到这里了，希望以上内容可以对大家有一定的帮助，如果你还有很多疑惑没有解开，可以关注创新互联网站制作公司行业资讯频道了解更多相关知识。