Tools Interaction

When collaboration is active, all primary tools in the viewer become collaborative by default. This includes annotations, measurements, and document state changes.

• Annotations: Markups, shapes, and arrows drawn by one user appear instantly on all other users screens.
• Measurements: Dimension lines, area calculations, and counts are synchronized across all participants.
• Navigation: Depending on configuration, page navigation and zoom levels can also be synchronized.

A core feature of the collaborative experience is "who did what". Each annotation and measurement is uniquely attributed to the user who created it.

When a user starts drawing, their identity (established via User Set) is used to label the interaction. Other participants will see a label indicating which user is currently active.

• Participant Labels: Hovering over or selecting an annotation displays the creators display name.
• Live Indicators: Visual cues (e.g., cursor colors) help identify multi-user presence on the canvas.
• Persistent Ownership: Even after the session ends, the metadata for each markup contains the original author information.

Real-time synchronization ensures all users see the same state, while persistence ensures that state is saved to your database.

• Auto-Save Integration: When `setAutoSave` is enabled, the Canvas emits an `annotationCreated` event every time a collaborative tool action is completed.
• Metadata Tracking: Each save event includes the `username` and `displayName` of the user who performed the action, ensuring correct attribution in your database.
• Manual Extraction: You can also use the `saveAnnotations` message to pull the entire collaborative state at any time.

// Listening for persistent collaborative actions:
window.addEventListener('message', (event) => {
  if (event.data.type === 'annotationCreated') {
    const { payload } = event.data;
    console.log(`User ${payload.creator} created ${payload.type}`);
    // Save to your backend API
  }
});

The synchronization bridge handles multiple users opening the same file across different systems. All live actions are broadcasted in sub-second latency.

• Simultaneous Drawing: Multiple users can draw markups or take measurements at the same time without locking the document.
• Global Navigation: If configured, panning and zooming are synchronized, allowing a presenter to lead a group walkthrough.
• Conflict Handling: The Canvas resolves overlapping actions logically to maintain a consistent state for all participants.

Try out collaborative tools in real-time. When collaboration is enabled, these actions simulate the synchronization across multiple sessions.