html输入信号矩阵,使用HTML中的矩阵创建JS径向渐变

带有矩阵的JSRadial渐变是通过以下方式创建的。您可以尝试运行以下方法以使用矩阵创建JS径向渐变-var canvas1 = document.getElementById("canvas"); //canvas1 variable to identify given canvas

var ctx1 = canvas.getContext("2d"); //This is used to tell context is 2D

var gradient1 = ctx1.createRadialGradient(100/horizontalScale, 100/verticalScale, 100,

100/horizontalScale,100/verticalScale,0); //This will create gradient with given canvas context

gradient1.addColorStop(1,"green"); //New color green is added to gradient

gradient1.addColorStop(0,"red"); //New color red is added to gradient

ctx1.scale(horizontalScale, verticalScale); //Context matrix ctx1 is shrinked according to horizaontal

and vertical scale

ctx1.fillStyle = gradient; //Given gradient is drawn

ctx1.fillRect(0,0, 100/horizontalScale, 100/verticalScale); //Rectangle is stretched according to scale

ctx1.setTransform(0,1,1,0,1,1);  //Context matrix is reset

canvas {

background-color: purple;

}

//画布以紫色背景色绘制