lienzo html5 dibuja efecto de color degradado radiactivo

Todavía hay algunos errores en el lienzo. Por ejemplo, fillRect es un método, no un atributo. Si escribe fillRect=, no tendrá ningún efecto y no informará un error....

Aquí se usa la API createRadialGradient. Esta API recibe 6 parámetros. Los tres primeros representan el círculo inferior y los tres últimos representan el círculo superior. La instancia devuelta aún se puede usar con addColorStop.

can2_context es el contexto de dibujo del lienzo de getContext

 función Radia(bottom_x,bottom_y,bottom_r,top_x,top_y,top_r){ this.bottom_x=bottom_x; this.top_y=top_y; arriba_r; this.gradient=can2_context.createRadialGradient(this.bottom_x,this.bottom_y,this.bottom_r,this.top_x,this.top_y,this.top_r)}Radia.prototype.addColor=function(){ for(var i=0; i<argumentos.longitud;i++){ this.gradient.addColorStop(argumentos[i].num,argumentos[i].color) }}Radia.prototype.draw=function(x1,y1,x2,y2){ can2_context.fillStyle=this.gradient; (x1,y1,x2,y2)}var some1=new Radia(canvas_2.width/2, canvas_2.height-100, 0, canvas_2.width/2, 0, 300)some1.addColor({num:0.2,color:azul},{num:1,color:amarillo},{num:0.7,color:blanco })some1.draw(0, 0, lienzo_2.ancho, lienzo_2.alto)

Lo anterior es el efecto de gradiente radiactivo de dibujo de lienzo html5 introducido por el editor. Espero que le resulte útil. Si tiene alguna pregunta, déjeme un mensaje y el editor le responderá a tiempo. ¡También me gustaría agradecer a todos por su apoyo al sitio web de artes marciales VeVb!