Javascript 在着色器中更改矩形的大小和比例

我是新着色器的新手，我正在尝试更改矩形的大小和比例，我找到了更改大小的方法，但我没有找到修改比例的方法

这是我的片段着色器：

\ifdef glu
精密中泵浮子；
#恩迪夫
均匀vec2u_分辨率；
均匀浮动u_时间；
void main（）{
vec2 st=gl_FragCoord.xy/u_resolution.xy；
vec3颜色=vec3（0.0）；
//左下角
vec2 bl=阶跃（vec2（0.1），st*0.5）；
浮动pct=bl.x*bl.y；
//右上角
vec2 tr=阶跃（vec2（0.1），（1.0-st）*0.5）；
pct*=tr.x*tr.y；
颜色=vec3（pct）；
gl_FragColor=vec4（颜色，1.0）；
}

左下角由行中的

vec2（0.1）

定义

vec2bl=step（vec2（0.1），st*0.5）；

并将右上角按直线中的

vec2（0.1）

（从左下角偏移）

vec2tr=step（vec2（0.1），（1.0-st）*0.5）；

注意，

vec2（0.1）

构造一个二维向量，其中

x=0.1

和

y=0.1

vec2（0.1）

构造与

vec2（0.1，0.1）

相同的向量

---

为左下角和右上角定义局部变量。e、 g:

vec2 bottomleft=vec2（0.3,0.2）；
vec2-topright=vec2（0.7,0.8）；

并在表达式中使用它。e、 g:

\ifdef glu
精密中泵浮子；
#恩迪夫
均匀vec2u_分辨率；
均匀浮动u_时间；
void main（）
{
vec2 bottomleft=vec2（0.3,0.2）；
vec2-topright=vec2（0.7,0.8）；
vec2 st=gl_FragCoord.xy/u_resolution.xy；
vec2 bl=阶跃（左下角，st）；
vec2 tr=阶跃（1.0-topright，1.0-st）；
浮动pct=bl.x*bl.y*tr.x*tr.y；
vec3颜色=vec3（pct）；
gl_FragColor=vec4（颜色，1.0）；
}

---

或者，矩形可以由左下角原点和大小定义。e、 g:

void main（）
{
vec2 bottomleft=vec2（0.3,0.2）；
vec2大小=vec2（0.4,0.6）；
vec2 st=gl_FragCoord.xy/u_resolution.xy；
vec2 bl=阶跃（左下角，st）；
vec2 tr=步长（1.0-bottomleft-size，1.0-st）；
浮动pct=bl.x*bl.y*tr.x*tr.y；
vec3颜色=vec3（pct）；
gl_FragColor=vec4（颜色，1.0）；
}

问题解决了吗？