2011-11-29 3 views
1

나는이 프로젝트에서 작업하고 있습니다 ... 브라우저에서 작업한다고 가정하면 그리고 아이폰에서도 마찬가지입니다 ... 그래서 지금 이벤트 문제를 다루고 있습니다. .. 자바 스크립트 이벤트를 아이폰에 사용할 수 있습니까 ??? ???아이폰 - 자바 스크립트 이벤트 ... three.js에 대한

답변

4

필요한 기능에 따라 다르지만 휴대 전화에서는 this을 사용해보세요. 다음과 비슷한 큐브 구조를 렌더링해야합니다. three.js cubes http://lifesine.eu/labs/media/images/vector.gif

터치하고 드래그 할 수 있어야합니다. 이것은 three.js를 함께 제공 이전 큐브 드래그 샘플을 기반으로하고 여기에 이벤트가 사용된다

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 등과 같이 명확하지 않을 수도 있습니다. 해당 링크의 소스 코드를 자유롭게 사용할 수는 있지만 작년에 코딩 했으므로 three.js 코드 중 일부는 약간 다를 수 있습니다 (어쩌면 재료 등), 이벤트 부분은 코드에 붙여 넣기 만하면 작동합니다. 덕분에 다시 친구를 위해

HTH는

+0

덕분에! ... 나는 내가 (Y)입니다에서만 작동하는 회전을 의미 ... 아이폰에서 작동하지 않습니다, 슬프지만 진실하고, 데모를 시도했다. 두 번째 문제는 ... 내 문제가 더 커 ... "카메라"를 회전해야 할뿐만 아니라 캔버스에 드래그 가능한 객체를 만들었습니다. – BorisD

+0

이 질문보기 : http://stackoverflow.com/questions/8307535/three-js-project-on-iphone-events-issue-selectdrag-object – BorisD

+0

기술적으로, Y에서 회전 할 수 있다면 터치 이벤트가 작동합니다. ** ** 귀하의 질문에 대한 답변입니다 (" 아이폰에 사용 ");). 그것은 내가 코딩 한 방식이기 때문에 Y에서만 작동합니다. 그렇지 않으면 (끌기와 같이) 다르게 처리 할 수있는 것이 없습니다. 현재 다른 질문을 할 수 없습니다. 귀하의 [다른 질문] (http://stackoverflow.com/questions/8292486/three-js-how-to-detect-what-shape-was-selected-after-drag)을보고 몇 가지 문제점을 발견했습니다. 그러나 내가 말했던 것처럼, 지금은 시간이 없다. 나중에 주일에 시도 할 것입니다 –