Three.js: How to move / pan camera using middle mouse button? - three.js

I am using Three.js with OrbitControls.js. Is there any way I can extend the functionality to implement a "move camera with middle mouse button pressed" feature? Which is known from 3d programs.
Alternatively it could also be a combination of holding down Shift and moving the mouse.
Goal is to give the users not only the cursors keys for navigation, i.e. repositioning the camera, but also a way by using the mouse.
I would like to implement this feature in this cube program.

You already have that functionality with the standard TrackballControls, if I'm understanding correctly, just right click and drag. If you want to change that to middle mouse / shift look at the onMouseDown() function and copy the code you want into a middle mouse or shift key event.

Related

Intercepting the mouse coordinates and modifying it

I would like to create an app that intercepts the mouse coordinates and modify them.
I want to build an app that runs in the background and intercepts the mouse movement, filtering it, for all apps running on macOS.
Suppose the mouse is scrolling freely but if the user presses a global shortcut, like CMD ALT X, the vertical scrolling is filtered and just the horizontal scrolling passes to macOS.
First question: what should I use to do that? Just point me in the right direction if the topic is too extensive.
Second question: is that possible to do for a sandbox app?

How to webgl detach transform control when click another range not transform control

I'm developing webgl graphics with three.js
While I developing, I'm facing something stuck.
I'm trying to detach transform control when I click another range(ex, grid or another objects) not transform control.
I implemented it by checking clicked position.
For example, I set event handler with mouse down and in there, I store that mouse position. Also I set event handler with mouse up and in there, I compare mouse positions both mouse down and mouse up. If two positions are same, I detach the transform controller. However with this implementation, transform controller was disappeared though I clicked transform controller.
I just wanna detach transform control when I click another position not transform control
Does anyone help me please with this issue?
Thank you in advance.

Updating canvas without hovering

I'm making something like MS Paint using jCanvas library. I've put a button OUTSIDE the canvas. The button rotates the selected layer clockwise but I can't see any change unless I hover the canvas with mouse. I want the layer to be rotated by the time I press the button.
I tried using restoreCanvas() function but it didnt't work. How can I make a canvas automatically refreshed when a button out of it is pressed?
Sorry for bad English.
Solved. This function refreshes the canvas: $('canvas').drawLayers();

Clip mouse movement in Carbon

How can I clip the mouse movement into a window Region using Carbon?
I don't think there is any simple way to do it, and that's good... it's a "non-Mac-like" behavior that will freak out your users. That said, it would probably be possible to use CGAssociateMouseAndMouseCursorPosition to uncouple the mouse from the cursor position, then monitor mouse events and move the cursor to where you want.

Mouse over effect on touchscreen

Obviously you dont have a mouse over effect on a touchscreen, but I would like some effect, maybe onclick? Does anybody have any suggestions?
On the touchscreen I'm working with right now, the mouse over is a persistent effect of clicks. In other words, it's as if after clicking an item with an actual mouse and releasing the button, one never moved the mouse pointer afterwards.

Resources