You can easily tweak the Three.js Trackpad Control to provide 2d planar pan functionality with left mouse button dragging.
See the official trackball controls demo to compare pan vs. rotate behavior.
Some visualizations simultaneously benefit from a 3d representation yet present a challenge for users new to 3d environment manipulation.
In these situations left-click rotation of the scene may be of limited utility and more likely to confuse or frustrate the user.
Fortunately the TrackpadControls are well instrumented and the code changes required are trivial.
// Original STATE variable
var STATE = { NONE: - 1, ROTATE: 0, ZOOM: 1, PAN: 2, TOUCH_ROTATE: 3, TOUCH_ZOOM_PAN: 4 };
Is changed to…
var STATE = { NONE: - 1, ROTATE: 2, ZOOM: 1, PAN: 0, TOUCH_ROTATE: 3, TOUCH_ZOOM_PAN: 4 };
Just swapping out the codes for the mouse button involved, zoom <-> pan. Please feel free to download the modified controls used in the demo above.
It’s too bad these aren’t configuration options or attributes on the controls object.