I made it! Here it is the final working code:
function getInteractorStyle(){
const interactorStyleDefinitions = { // To be used by vtkInteractorStyleManipulator
// Pan on Middle button drag and on Shift + Left button drag
Pan: {
klass: vtk.Interaction.Manipulators.vtkMouseCameraTrackballPanManipulator,
options: [
{ button: 2 },
{ button: 1, shift: true }]
},
// Zoom on Ctrl + Right button drag and on scroll
Zoom: {
klass: vtk.Interaction.Manipulators.vtkMouseCameraTrackballZoomManipulator,
options: [
{ button: 3, control: true },
{ dragEnabled: false, scrollEnabled: true }
]
},
// Rotate on Left button drag
Rotate: {
klass: vtk.Interaction.Manipulators.vtkMouseCameraTrackballRotateManipulator,
options: [
{ button: 1 }
]
},
// Roll on Right button drag and on Ctrl + Left button drag
Roll: {
klass: vtk.Interaction.Manipulators.vtkMouseCameraTrackballRollManipulator,
options: [
{ button: 1, control: true },
{ button: 3 }
]
}
};
const interactorStyle = vtk.Interaction.Style.vtkInteractorStyleManipulator.newInstance();
interactorStyle.removeAllMouseManipulators();
for (let [keyName, Definition] of Object.entries(interactorStyleDefinitions)) {
for (let option of Definition.options) {
const manipulator = Definition.klass.newInstance(option);
interactorStyle.addMouseManipulator(manipulator);
}
};
// Always add gesture
interactorStyle.addGestureManipulator(
vtk.Interaction.Manipulators.vtkGestureCameraManipulator.newInstance()
);
return interactorStyle;
}
[This example]( vtk.js (kitware.github.io)) is a bit misleading, since it doesn’t tells you you can instantiate a manipulator directly with their options and instead leads you to set each option independently.
Also Each button option requires a whole new manipulator instance. This was the critical part.