Zdarzenia dotyku w javascript dla 3d graphera

Niedawno dorobiłam możliwość obsługi obracania powierzchni w 3d grapherze oraz w implicit equations 3d grapherze za pomocą dotyku na urządzeniach mobilnych. Używam następujących zdarzeń:

  • touchstart - rozpoczęcie zdarzenie dotyku. Odpowiednik mouseDown
  • touchmove - wywoływane podczas przesuwania palcem po obiekcie. Odpowiednik mouseMove
  • touchend - wywoływane kiedy dotykanie się kończy. Odpowiednik mouseUp.
Rejestracja funkcji obsługującej zdarzenia wygląda następująco (przykład specyficzny dla 3d graphera)
renderer.domElement.addEventListener('touchstart', onDocumentMouseDown, false);
renderer.domElement.addEventListener('touchend', onDocumentMouseUp, false);
renderer.domElement.addEventListener('touchmove', onDocumentTouchMove, false);
W celu odczytanie współrzędnych dotkniętego punktu należy użyć.
e.changedTouches[0].pageX;
e.changedTouches[0].pageY;
Efekt zoomowania na urządzeniach mobilnych wprowadziłam dodając zdarzenia pinchin i pinchout wykorzystując bibliotekę hammer.js. Poniżej przykładowy kod wykorzystujący tą bibliotekę.
Hammer(renderer.domElement).on("pinchin", function(e) {
	e.preventDefault();
	obj.scale.x *= 0.99;
	obj.scale.y *= 0.99;
	obj.scale.z *= 0.99;
});
Przydatne materiały:
Touchevents - JavaScript Kit