Add VTK.js rendering for engineering visualization files with example MCP server #86

Copilot · 2025-11-18T04:38:50Z

Implements 3D visualization capability for engineering and scientific file formats using VTK.js in the canvas panel, including a built-in MCP server for generating sample 3D shapes.

Changes

Core Implementation

New VtkViewer component handles 3D rendering for 11 formats: VTK legacy, VTK XML (VTP/VTU/VTI/VTS/VTR), STL, OBJ, PLY, GLTF/GLB
Extended CanvasPanel to route detected 3D files to VTK renderer
File type detection in useFiles.js recognizes engineering formats by extension

Rendering Pipeline

Automatic reader selection based on file format (vtkPolyDataReader, vtkSTLReader, etc.)
Handles both S3-stored files and inline base64 content from progress artifacts
Interactive controls: rotate (left-click drag), pan (right-click drag), zoom (scroll), reset view

VTK Example MCP Server

New MCP server in backend/mcp/vtk-example/ for generating 3D shapes on demand
Two tools: generate_3d_shape (single shapes) and generate_sample_files (all samples)
Generates cube, sphere, pyramid, cylinder, and torus in VTK/STL formats
Files automatically rendered as artifacts in canvas panel
Configured in config/defaults/mcp.json and available to all users
Includes standalone sample generator script (generate_samples.py)

Example Integration

// File type detection
getFileType('simulation.vtu')  // Returns 'vtk'

// Rendering in CanvasPanel
case 'vtk':
  return <VtkViewer fileContent={blob} filename={file.filename} />

Example Usage

Generate a sphere
Show me a torus
Create sample 3D files

Documentation & Testing

Comprehensive guide: supported formats, usage patterns, technical details, MCP server usage
15 unit tests for file type detection
VTK Example MCP server with full documentation and README

Dependencies

Added @kitware/[email protected] (no vulnerabilities)
Fixes add a engineering viz canvas rendering capability #85

Original prompt

This section details on the original issue you should resolve

<issue_title>add a engineering viz canvas rendering capability</issue_title>
<issue_description>use VTK.js to render common science and engineering files. </issue_description>

Comments on the Issue (you are @copilot in this section)

Fixes add a engineering viz canvas rendering capability #85

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Co-authored-by: garland3 <[email protected]>

garland3 · 2025-11-18T05:14:52Z

@copilot add an example mcp that returns files renderable by vtk. move the generation script to this folder. So make a new /backend/mcp/vtk-example mcp server

Co-authored-by: garland3 <[email protected]>

Copilot · 2025-11-18T05:24:21Z

@copilot add an example mcp that returns files renderable by vtk. move the generation script to this folder. So make a new /backend/mcp/vtk-example mcp server

Created the vtk-example MCP server in backend/mcp/vtk-example/ with two tools:

generate_3d_shape - Creates single shapes (cube, sphere, pyramid, cylinder, torus) in VTK/STL format
generate_sample_files - Generates all 5 shapes at once

The generation script was moved to backend/mcp/vtk-example/generate_samples.py and improved to accept custom output directories.

The server is configured in config/defaults/mcp.json and automatically available to users. Files are returned as artifacts that auto-render in the canvas with the VTK.js viewer.

Commit: 1758ab4

…le type detection

…ipping planes

… for slicing

…rmat and enhance surface representation

… application

frontend/src/components/VtkViewer.jsx

@@ -0,0 +1,605 @@
+import { useEffect, useRef, useState } from 'react'
+import { RotateCw, ZoomIn, ZoomOut, Maximize2, Scissors, Play, Pause } from 'lucide-react'


The best way to fix the problem is to remove any unused imports from the import statement on line 2. This will clarify which icons are actually used in the component, improve readability, and may have a small positive impact on the final bundle size.

Specifically:

Examine the code in frontend/src/components/VtkViewer.jsx and determine which (if any) of RotateCw, ZoomIn, ZoomOut, Maximize2, Scissors, Play, and Pause are actually used.

Remove each named import that is not referenced anywhere in the file.

Retain only those icons actively used (for e.g. in JSX as <ZoomIn />, etc.).

If none are used, remove the import statement entirely.

Make this change only to the import statement (lines 2–2).

No other changes, imports, or definitions are needed, and no dependencies.

scripts/generate_vtk_samples.py

+
+
+if __name__ == "__main__":
+    import sys


To fix the unused import issue, you should simply remove the line importing the sys module from scripts/generate_vtk_samples.py. This line appears at line 129 and can be deleted. No other changes are needed, as there is no use of sys anywhere else in the provided code. Only line 129 should be deleted, and care should be taken not to alter or remove any other code.

github-actions · 2025-11-19T03:47:43Z

🔒 Security Scan Results

Security Scan Summary

Scan Results

Python SAST (Bandit)

⚠️ Security issues found in Python code

Recommendations

Review all SARIF files uploaded to GitHub Security tab
Address high and critical severity vulnerabilities immediately
Run npm audit fix and pip-audit locally to fix dependencies
Consider implementing additional security controls

Initial plan

d061b2e

Copilot AI assigned Copilot and garland3 Nov 18, 2025

Copilot started work on behalf of garland3 November 18, 2025 04:39 View session

Copilot AI and others added 4 commits November 18, 2025 04:44

Add VTK.js library and VtkViewer component with CanvasPanel integration

56afbbd

Co-authored-by: garland3 <[email protected]>

Fix linting errors and add VTK file type tests

1d1daca

Co-authored-by: garland3 <[email protected]>

Add documentation and sample file generator for VTK visualization

36a8627

Co-authored-by: garland3 <[email protected]>

Update README to mention VTK visualization capability

87d6429

Co-authored-by: garland3 <[email protected]>

Copilot AI changed the title ~~[WIP] Add VTK.js rendering capability for science and engineering files~~ Add VTK.js rendering for engineering visualization files Nov 18, 2025

Copilot AI requested a review from garland3 November 18, 2025 04:55

Copilot finished work on behalf of garland3 November 18, 2025 04:55

Copilot started work on behalf of garland3 November 18, 2025 05:15 View session

Add vtk-example MCP server for generating 3D shapes

1758ab4

Co-authored-by: garland3 <[email protected]>

Copilot AI changed the title ~~Add VTK.js rendering for engineering visualization files~~ Add VTK.js rendering for engineering visualization files with example MCP server Nov 18, 2025

Copilot finished work on behalf of garland3 November 18, 2025 05:26

garland3 added 8 commits November 19, 2025 01:26

feat(file_storage): add VTK.js file type support and update canvas fi…

f2874c2

…le type detection

feat(VtkViewer): enhance VTK file parsing for legacy and binary formats

cd979fe

feat(VtkViewer): add slicing functionality with adjustable parameters

9c7512b

feat(VtkViewer): enhance rendering by computing normals and adding cl…

88356db

…ipping planes

feat(VtkViewer): add auto-rotation feature and custom normal controls…

aa9819e

… for slicing

feat(VtkViewer): update cantilever beam generation to use POLYDATA fo…

a59247f

…rmat and enhance surface representation

feat(VtkViewer): add scalar field coloring and selection functionality

1daa96c

feat(VtkViewer): add flip clipping direction toggle and adjust normal…

ce66fe8

… application

github-advanced-security bot found potential problems Nov 19, 2025

View reviewed changes

@@ -1,6 +1,6 @@
             import { useEffect, useRef, useState } from 'react'
-            import { RotateCw, ZoomIn, ZoomOut, Maximize2, Scissors, Play, Pause } from 'lucide-react'
             // Import VTK.js modules
             import '@kitware/vtk.js/Rendering/Profiles/Geometry'
             import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow'

@@ -126,7 +126,6 @@
             if __name__ == "__main__":
-                import sys
                 import os
                 # Create test_data directory if it doesn't exist

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add VTK.js rendering for engineering visualization files with example MCP server #86

Add VTK.js rendering for engineering visualization files with example MCP server #86

Uh oh!

Copilot AI commented Nov 18, 2025 •

edited

Loading

Uh oh!

garland3 commented Nov 18, 2025

Uh oh!

Copilot AI commented Nov 18, 2025

Uh oh!

Check notice

Copilot Autofix

Check notice

Copilot Autofix

github-actions bot commented Nov 19, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		@@ -0,0 +1,605 @@
		import { useEffect, useRef, useState } from 'react'
		import { RotateCw, ZoomIn, ZoomOut, Maximize2, Scissors, Play, Pause } from 'lucide-react'

Add VTK.js rendering for engineering visualization files with example MCP server #86

Are you sure you want to change the base?

Add VTK.js rendering for engineering visualization files with example MCP server #86

Uh oh!

Conversation

Copilot AI commented Nov 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changes

Comments on the Issue (you are @copilot in this section)

Uh oh!

garland3 commented Nov 18, 2025

Uh oh!

Copilot AI commented Nov 18, 2025

Uh oh!

Check notice

Copilot Autofix

Check notice

Copilot Autofix

github-actions bot commented Nov 19, 2025

🔒 Security Scan Results

Security Scan Summary

Scan Results

Python SAST (Bandit)

Recommendations

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Copilot AI commented Nov 18, 2025 •

edited

Loading