canvas怎样设定暗影？canvas设定暗影的办法-

我们晓得可以用css来实现暗影结果，但是html5中canvas也可以用来设定暗影结果，所以，接下来的这篇文章将给大家来介绍对于怎样用canvas来设定暗影结果，话未几说，直接来看内容。 我们晓得可以用css来实现暗影结果，但是html5中canvas也可以用来设定暗影结果，所以，接下来的这篇文章将给大家来介绍对于怎样用canvas来设定暗影结果，话未几说，直接来看内容。

第一要晓得在canvas中进行绘制时，无论是文本、图形、还是图像，也无论是描边还是添补，都可以通过设定高低文对象的相干属性，来为它们设定暗影。

canvas新建暗影结果需要运用下列四个属性：

shadowColor：暗影的色彩，其默许值为完全透亮的玄色。因而，要是没有把该属性设定为不透亮，则暗影是不成见的。该属性只能设定为一个表示色彩的字符串，不克不及运用渐变或图案。运用半透亮的暗影可以发生很传神的暗影结果，由于透过暗影还能看到配景。

shadowOffsetX：暗影在X轴的偏移量，单位为像素。默许值为0，暗影位于图形正下方，暗影是不成见的。大于0向右偏移，小于0向左偏移。暗影偏移量越大，发生的暗影也越大，同时会感觉绘制的图形在画布是浮得也越高。

shadowOffsetY：暗影在Y轴的偏移量，单位为像素。默许值为0，暗影位于图形正下方，暗影是不成见的。大于0向下偏移，小于0向上偏移。暗影偏移量越大，发生的暗影也越大，同时会感觉绘制的图形在画布是浮得也越高。

shadowBlur：暗影的依稀值。是一个与像素无关的值，被用于高斯依稀方程中，以便对暗影进行依稀化处置。默许值为0，表示发生一个清晰的暗影。该值越大，表示暗影越依稀。

注明：依据canvas标准，只要在知足下列两个前提时，阅读器才会绘制暗影：

1、指定了一个非全透亮的shadowColor属性值；

2、shadowOffsetX、shadowOffsetY、shadowBlur三个属性中，至少有一个属性的值不是0。

下面我们就来看看canvas实现的暗影结果实例代码：

 
    
    
 
 
 
    
    



    

    
打赏
    

    

    	
        
    	

    		
感谢您的支持，我会继续努力的!
    	
    	

    		
    	
    		
扫码打赏，你说多少就多少
    	

    		

	    		
	    		
    		
    		

	    		
	    		
    		
    	
    	

    		
打开支付宝扫一扫，即可进行扫码打赏哦
    		
百分百源码网 建议打赏1～10元，土豪随意，感谢您的阅读！