https://github.com/tscircuit/circuit-json-to-gltf
Converts circuit JSON to 3D GLTF or GLB files. Used for exporting circuits as 3D models
https://github.com/tscircuit/circuit-json-to-gltf
circuit-json electronics electronics-engineering tscircuit
Last synced: 4 months ago
JSON representation
Converts circuit JSON to 3D GLTF or GLB files. Used for exporting circuits as 3D models
- Host: GitHub
- URL: https://github.com/tscircuit/circuit-json-to-gltf
- Owner: tscircuit
- License: mit
- Created: 2025-08-08T18:28:00.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2025-12-23T18:13:08.000Z (5 months ago)
- Last Synced: 2025-12-25T02:09:54.561Z (5 months ago)
- Topics: circuit-json, electronics, electronics-engineering, tscircuit
- Language: TypeScript
- Homepage: https://circuit-json-to-gltf.vercel.app/renderer.html?fixtureId=%7B%22path%22%3A%22CircuitToGltfDemo.fixture.tsx%22%7D&locked=true
- Size: 2.22 MB
- Stars: 2
- Watchers: 0
- Forks: 24
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# circuit-json-to-gltf
Converts circuit JSON to 3D GLTF files. Used for exporting circuits as 3D models.
[Online Playground](https://circuit-json-to-gltf.vercel.app/renderer.html?fixtureId=%7B%22path%22%3A%22CircuitToGltfDemo.fixture.tsx%22%7D&locked=true)
[](https://www.npmjs.com/package/circuit-json-to-gltf)
## Features
- Convert circuit JSON to GLTF 2.0 format (JSON or binary)
- Render PCB board with accurate dimensions and textures
- Support for STL and OBJ model loading for components
- High-quality board texture rendering using circuit-to-svg and resvg
- Automatic component positioning and generic 3D representations
- Customizable camera, lighting, and material settings
## Installation
```bash
bun install circuit-json-to-gltf
```
## Usage
```typescript
import { convertCircuitJsonToGltf } from "circuit-json-to-gltf"
// Your circuit JSON data
const circuitJson = {
elements: [
{
type: "pcb_board",
pcb_board_id: "board1",
center: { x: 0, y: 0 },
width: 80,
height: 60,
thickness: 1.6
},
// ... components, traces, etc.
]
}
// Convert to GLTF
const gltf = await convertCircuitJsonToGltf(circuitJson, {
format: "gltf", // or "glb" for binary
boardTextureResolution: 2048
})
// Save the result
fs.writeFileSync("circuit.gltf", JSON.stringify(gltf))
```
## API
### Main Function
```typescript
convertCircuitJsonToGltf(circuitJson: CircuitJson, options?: ConversionOptions): Promise
```
### Options
- `format`: "gltf" (JSON) or "glb" (binary) - default: "gltf"
- `boardTextureResolution`: Resolution for board texture rendering - default: 1024
- `includeModels`: Whether to load external 3D models - default: true
- `modelCache`: Map for caching loaded models
- `backgroundColor`: Background color for board rendering
- `showBoundingBoxes`: Show bounding boxes for debugging
## Architecture
The converter uses a modular architecture:
1. **Circuit to 3D Converter**: Parses circuit JSON and creates a 3D scene representation
2. **Board Renderer**: Renders PCB layers as textures using circuit-to-svg and resvg
3. **Model Loaders**: Load STL and OBJ files for component 3D models
4. **GLTF Builder**: Constructs the final GLTF using Three.js
## Development
```bash
# Install dependencies
bun install
# Run tests
bun test
# Run example
bun run examples/basic-conversion.ts
```
## Implementation Details
- Uses `circuit-to-svg` to render the top/bottom layers of the board to SVG
- Uses `@resvg/resvg-js` to convert SVG to PNG textures
- Includes built-in STL and OBJ parsers for 3D model loading
- Pure GLTF 2.0 implementation without external 3D library dependencies
- Supports both JSON (.gltf) and binary (.glb) formats
- Embeds all assets (textures, buffers) directly in the output