Question

我正在尝试使用webGL缩放3d立方体。我已经定义了缩放图像所需的所有部分，但是当我应用滑块控制缩放时，什么也没发生。

但是，如果我在.js文件中设置了比例缩放参数，则可以正确缩放图像，但是无法使用滑块控制它。这是我的代码：

JS文件-

//matrix to do scaling 

var scale_v = 1.0;

var xformMatrix = new Float32Array([
scale_v,   0.0,  0.0,  0.0,
0.0,  scale_v,   0.0,  0.0,
0.0,  0.0,  scale_v,   0.0,
0.0,  0.0,  0.0,  1.0  ]);



window.onload = function init() {
//After loaded shaders and initialize attribute buffers

[....]

 var u_xformMatrix = gl.getUniformLocation(program, 'u_xformMatrix');
 gl.uniformMatrix4fv(u_xformMatrix, false, xformMatrix);

 document.getElementById("radiusSlider").onchange = function(event) {
    scale_v=event.target.value;
 };

HTML文件-

<div>
Scaling -5<input id="scalingSlider" type="range"
min="-5" max="5" step="0.5" value="1" />
5
</div>

<script id="vertex-shader" type="x-shader/x-vertex">

[....]
uniform mat4 u_xformMatrix;

void main()
{
   fColor = vColor;
   gl_Position = 
   projectionMatrix*modelViewMatrix*vPosition*u_xformMatrix;
}
</script>

图片无法缩放

0 个答案: