Question

if( keyboard.pressed("up"))
            pobjects[movementControls.translate].translateX(1);
        if( keyboard.pressed("down"))
            pobjects[movementControls.translate].translateX(-1);
        if( keyboard.pressed("left"))
            pobjects[movementControls.translate].translateZ(-1);
        if( keyboard.pressed("right"))
            pobjects[movementControls.translate].translateZ(1);
        if( keyboard.pressed("w"))
            pobjects[movementControls.translate].translateY(1);
        if( keyboard.pressed("s"))
            pobjects[movementControls.translate].translateY(-1);
        if( keyboard.pressed("x"))
            cobjects[movementControls.rotate].rotation.x+=0.1;
        if( keyboard.pressed("y"))
            cobjects[movementControls.rotate].rotation.y+=0.1;
        if( keyboard.pressed("z"))
            cobjects[movementControls.rotate].rotation.z+=0.1;

基本上我想使用纯webGl而不是three.js函数来旋转，缩放和翻译对象。

Answer 1

您可能希望在learningwebgl.com上查看本教程。

你基本上必须为'keydown'和'keyup'事件添加事件监听器，并编写相应的函数来捕获事件发生时的事件，例如通过将按下的键作为属性添加到函数对象，如：

var currentlyPressedKeys = { };

function onKeyDown (e) {

  currentlyPressedKeys[e.keyCode] = true;

}

function onKeyUp (e) {

  currentlyPressedKeys[e.keyCode] = false;

}

然后你需要一个其他的功能来定义当按下某个键时应该做什么，比如

if ( currentlyPressedKeys[38] ) { //...

例如，

。（代表您可以找到的密钥的数字here。）

因此，您可以在此处更改作为参数传递给{em> 的函数的变量rotationY，translationZ等。 em>和翻译表示对象的矩阵，然后将原始顶点位置数据与顶点着色器相乘。

如果你不知道如何做到这一点，我建议你回到链接教程的开头，或者看一看关于webglfundamentals.org的精彩解释。

希望，这有帮助。

Answer 2

你应该知道一件事。

没有“纯WebGL”等效于旋转，缩放和翻译对象。接近它的唯一WebGL功能是使用着色器实现的矩阵乘法。相反，旋转和其他转换通常由诸如GLMatrix之类的JavaScript库提供。

如何使用纯webGL而不是three.js进行此操作

2 个答案: