Iphone - Javascript Events ... for three.js [英] Iphone - Javascript Events...for three.js

问题描述

我在这个项目上工作...假设在浏览器中工作
和iphone以及...
所以我正在处理事件问题现在...
我可以使用javascript事件吗？

I working on this project...that suppose to work in a browser and in iphone as well... So I am dealing with the events issue right now... Wich javascript events can I use for iphone???

推荐答案

这取决于你需要什么功能，但尝试这个在你的手机上。
它应该渲染一些类似于这些的立方体结构：
three .js cube http://lifesine.eu/labs/media/images/vector.gif

It depends on what functionality you need, but try this on your phone. It should render some a cube structure similar to these: three.js cubes http://lifesine.eu/labs/media/images/vector.gif

应该可以触摸并拖动。这是基于three.js附带的旧多维数据集拖动示例，以下是使用的事件：

It should be possible to touch and drag. This is based on the old cube drag sample that comes with three.js and here are the events used:

document.addEventListener( 'mousedown', onDocumentMouseDown, false );
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
document.addEventListener( 'touchmove', onDocumentTouchMove, false );

这里是听众：

function onDocumentMouseDown( event ) {

                event.preventDefault();

                document.addEventListener( 'mousemove', onDocumentMouseMove, false );
                document.addEventListener( 'mouseup', onDocumentMouseUp, false );
                document.addEventListener( 'mouseout', onDocumentMouseOut, false );

                mouseXOnMouseDown = event.clientX - windowHalfX;
                targetRotationOnMouseDown = targetRotation;
            }

            function onDocumentMouseMove( event ) {

                mouseX = event.clientX - windowHalfX;
                mouseY = event.clientY - windowHalfY;

                targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.02;
            }

            function onDocumentMouseUp( event ) {

                document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
                document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
                document.removeEventListener( 'mouseout', onDocumentMouseOut, false );
            }

            function onDocumentMouseOut( event ) {

                document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
                document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
                document.removeEventListener( 'mouseout', onDocumentMouseOut, false );
            }

            function onDocumentTouchStart( event ) {

                if ( event.touches.length == 1 ) {

                    event.preventDefault();

                    mouseXOnMouseDown = event.touches[ 0 ].pageX - windowHalfX;
                    targetRotationOnMouseDown = targetRotation;

                }
            }

            function onDocumentTouchMove( event ) {

                if ( event.touches.length == 1 ) {

                    event.preventDefault();

                    mouseX = event.touches[ 0 ].pageX - windowHalfX;
                    targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.05;

                }
            }

请注意，有几个变量使用，这可能不明显，如targetRotation，targetRotationOnMouseDown等。请随意使用该链接的源代码，但请注意，我编码去年，所以，一些3.js代码可能会略有不同（可能是材料等），但事件部分仍然可以工作，如果你粘贴在您的代码。

Note that there are a few variables used, which might not be obvious, like targetRotation, targetRotationOnMouseDown, etc. Feel free to use the source code from that link, but be aware that I coded that last year, so, some of the three.js code might be slightly different(maybe materials and such), but the events part should still work if you paste it in your code.

HTH

这篇关于Iphone - Javascript Events ... for three.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！