Using a custom rendering

Integration based on another canvas rendering

You can use your own framework for ink capture, rendering and model and use the WebSocketClient to send strokes updates to our recognition Engine and receive all server updates.

We have developed a React app example based on a tldraw canvas to illustrate such a custom integration:

This example is based on the following main objects:

• A TldrawWebSocketClient extending WebSocketClient, which handles all communication with the recognition server.
• A Synchronizer which is responsible for intercepting canvas events and translating them to the Recognizer. It also receives gesture notifications from the Recognizer and invokes the gesture to perform associated actions.
• a Gesture which is responsible for applying the actions associated with gestures.
• a Converter which is responsible for converting handwritten content into a typed equivalent.

Please refer to this callflow for a more detailed description of these objects and how they interact with iinkTS and tldraw: