Холст html5 рисует цветовой эффект радиоактивного градиента

В Canvas все еще есть некоторые подводные камни. Например, fillRect — это метод, а не атрибут. Если вы напишете fillRect=, это не окажет никакого эффекта и не сообщит об ошибке....

Здесь используется API createRadialGradient. Этот API получает 6 параметров. Первые три представляют нижний круг, а последние три представляют верхний круг. Возвращенный экземпляр по-прежнему можно использовать с addColorStop.

can2_context — это контекст рисования холста getContext.

 функция Radia(bottom_x,bottom_y,bottom_r,top_x,top_y,top_r){ this.bottom_x=bottom_x; this.bottom_r=bottom_r; this.top_y=top_y; топ_р; 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; я<arguments.length;i++){ this.gradient.addColorStop(arguments[i].num,arguments[i].color) }}Radia.prototype.draw=function(x1,y1,x2,y2){ can2_context.fillStyle=this.gradient; can2_context.fillRect; (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:blue},{num:1,color:yellow},{num:0.7,color:white })some1.draw(0, 0, холст_2.ширина, холст_2.высота)

Вышеупомянутый эффект радиоактивного градиента на холсте HTML5, представленный редактором. Надеюсь, он будет вам полезен. Если у вас есть какие-либо вопросы, оставьте мне сообщение, и редактор ответит вам вовремя. Я также хотел бы поблагодарить всех за поддержку сайта боевых искусств VeVb!