[vtk.js] imagestream/DefaultProtocol.js incompatible with VTK

Web
1

Hello!

I was trying to setup a server with VTK and wslink and connect to it via vtk.js, but I am getting several errors in the web application. For example:
“TypeError(‘updateCamera() takes 5 positional arguments but 6 were given’)”

Is it possible that the Protocol, defined in vtk.js/Sources/IO/Core/ImageStream/DefaultProtocol.js is not compatible with the one in VTK/Web/Python/vtkmodules/web/protocols.py ?
If so: why is that, and is there a fix planned? Or did I use it wrong?

Thank you in advance
Christoph

2

Thanks for reporting the issue. The fix is here but ideally if you need also to use a parallel camera, you will need to use the useCameraParameters option on the image stream which will push to viewport.camera.update.params RPC that does not exist but that you can implement this way minus the difference between VTK and ParaView since the code below is for ParaView.

    @exportRpc("viewport.camera.update.params")
    def updateCameraParamters(self, viewId, params, forceUpdate = True):
      view = self.getView(viewId)

      if 'focalPoint' in params:
        view.CameraFocalPoint = params['focalPoint']

      if 'viewUp' in params:
        view.CameraViewUp = params['viewUp']

      if 'position' in params:
        view.CameraPosition = params['position']

      if 'parallelProjection' in params:
        view.CameraParallelProjection = params['parallelProjection']

      if 'viewAngle' in params:
        view.CameraViewAngle = params['viewAngle']

      if 'parallelScale' in params:
        view.CameraParallelScale = params['parallelScale']

      if forceUpdate:
          self.getApplication().InvalidateCache(view.SMProxy)
          self.getApplication().InvokeEvent('UpdateEvent')
3

Hello Sebastien,
thank you for your quick reply and fix! I have no more errors in my client / server setup but something is still wrong. I have basically just taken the server script from the paraview example and tried to connect to it with the [vtk.js](http://vtk.js ImageStream example).
The mouse interactions are streamed correctly, but only white images are streamed to the client:
For every mouse click only one white jpeg is uploaded

network
network728×132 29 KB

during interaction, the python server changes its size to the original window, and after the interaction it gets the size of the vtk.js renderer
python_window
python_window726×504 6.67 KB

the web window only shows the locally rendered cone
web_window
web_window746×504 5.81 KB

On this note, I would like to draw attention to the questions asked by bekos in the support channel:

The reason I am trying to change from a paraview client to ImageStream is that it enables binary image transfers. But I would also like to know what your roadmap for paraviewweb and vtk.js looks like.

4

Why don’t you use the server-side provided in the vtk.js example that you are trying out as a client?

5

That example only links to a paraview server which uses paraview.simple to construct a scene.

6

The server side you are using is not exposing the image delivery protocol that the client is expecting.

Try the code provided at the end of that thread

1 Like
7

Thank you again @Sebastien_Jourdain ! I am now using vtkRemoteView and this is working perfectly :slight_smile:

I made a minimal example, maybe you can have a look if I am using it as intended?
For now, only mouse interactions are working:

import vtkRemoteView from ‘vtk.js/Sources/Rendering/Misc/RemoteView’;
import SmartConnect from ‘wslink/src/SmartConnect’;

const remoteView = vtkRemoteView.newInstance();

const container = document.createElement(‘div’);
document.querySelector(‘body’).appendChild(container);
remoteView.setContainer(container);

const config = { sessionURL: ‘ws://localhost:1234/ws’ };
const smartConnect = SmartConnect.newInstance({ config });
smartConnect.onConnectionReady((connection) => {
// Network
const session = connection.getSession();
remoteView.setSession(session);
vtkRemoteView.connectImageStream(session);
remoteView.setViewId(-1);
});

smartConnect.onConnectionError(console.error);
smartConnect.onConnectionClose(console.error);
smartConnect.connect();

8

You are doing it right but since you plan to have some API call to the server, you should probably use the vtk.js/WSLinkClient.

import vtkWSLinkClient from 'vtk.js/Sources/IO/Core/WSLinkClient';

// Bind vtkWSLinkClient to our SmartConnect
vtkWSLinkClient.setSmartConnectClass(SmartConnect);

const clientToConnect = vtkWSLinkClient.newInstance({ configDecorator });
clientToConnect.setProtocols({
    WhatYouWant:  yourProtocol,
});

clientToConnect
    .connect(config)
    .then((validClient) => {
        validClient.getRemote().WhatYouWant.getApplicationState();
        [...]
        // clientToConnect === validClient
   });

where yourProtocol can look like that

export default function createMethods(session) {
  return {
    zoom: (scale) => session.call('appname.view.zoom', [scale]),
   [...]
   };
}