EasyTrace5000 - Browser-Based PCB CAM Tool

EasyTrace5000 is a browser-based CAM workspace that converts standard fabrication files (Gerber, Excellon, SVG) into G-code for CNC milling and precision SVG/PNG files for Laser processing. It runs entirely client-side on any browser, removing the need for software installation or cloud processing.

<div align="center"> <img src="./images/EasyTrace5000_workspace.webp" width="830" height="467" alt="EasyTrace5000 Workspace screenshot"> </div>

Try it!

• → Open Workspace ← - Runs entirely in your browser. No installation, accounts or cloud dependencies.
• Extra Documentation - Guides for CNC milling and accessibility features, plus a laser pipeline preview.

Key Features

• Multi-Operation Workflow A non-destructive workflow for common PCB CAM tasks:

  • Isolation Routing: Multi-pass trace isolation with external offsets.
  • Drilling: Smart peck-or-mill strategy selection with slot support.
  • Copper Clearing: Internal pocketing for large copper areas.
  • Board Cutouts: Path generation with optional tab placement.
  • Solderpaste Stencil (New): Ready to laser/vinyl cut files.

• Advanced Geometry Engine The first stage converts source files into offset geometry.

  • Analytic Parsing: Reads Gerber, Excellon and full SVG paths (including arcs and Béziers) and converts to geometry objects.
  • Board Rotation/Mirroring: Support for project rotation and horizontal/vertical mirroring. (No per object manipulation, yet)
  • Clipper2 Engine: Uses the WebAssembly compilation of Clipper2 for high-performance boolean operations.
  • Arc Reconstruction: Reconstructs true arcs (G2/G3) from polygonized post-Clipper2 data.
  • Unified Offset Pipeline: A single pipeline handles both external (isolation) and internal (clearing) multi-pass offsets.
  • Smart Drill Strategy: Analyzes drill hole/slot size against tool diameter and generates the required operational object.

• Optimized Toolpath Pipeline The final export stage converts geometry into smooth and efficient machine motion.

  • Geometry Translation: Translates geometry objects and their metadata into organized toolpath plans with proper entry/exit points.
  • Toolpath Optimization: Optionally restructures the toolpath plan to remove unnecessary movement:
    • Staydown Clustering: Geometrically analyzes paths and groups nearby cuts to minimize Z-axis retractions.
    • Path Ordering: Applies a nearest-neighbor algorithm to sort clusters and reduce rapid travel time.
    • Segment Simplification: Removes collinear points with angle-aware tolerance.
  • Machine Processing: Injects all necessary machine-specific commands:
    • Adds rapids, plunges, and retracts to safe/travel Z-heights.
    • Detects multi-depth passes on the same path to perform quick Z-plunges without retract.
    • Manages complex hole/slot entries (helix or plunge).
    • Handles Z-lifts for board tabs during cutout operations.

• Laser Pipeline (Beta) A dedicated export pipeline tailored for UV and fiber, currently open for testing.

  • Smart Clearances: Automatically generates isolation halos around conductive geometry that can then be cleared with a few different strategies.
  • Clearing Strategies: Choose between concentric offsets, solid filled regions, or highly optimized hatch generation (with adjustable orientation and passes).
  • Precision Export: Exports to high-DPI raster PNGs or true vector SVGs with enforced color coded hairline strokes and layers, ready for software like LightBurn or EZCAD.

• Multi-Stage Canvas Renderer

  • Render optimization: Provides smooth panning and zooming with batching, level of detail and viewport culling.
  • Multi-Stage Visualization: Clearly and distinctly renders Source (Gerber/SVG), Offset (generated paths), and Preview (tool-reach simulation) layers. Plus optional Debug features.
  • Smart Drill Rendering: Visually distinguishes source drill holes/slots, offset-stage peck marks, and final preview simulations with color-coded warnings for tool relation (exact/undersized/oversized).

Tech Stack

• Frontend: Vanilla JavaScript (ES6+), HTML5, CSS3
• Geometry Engine: Clipper2 via WebAssembly
• Rendering: Custom 2D Canvas-based layer renderer with an overlay system for grids, rulers, and origin points.
• File Parsing: Native parsers for Gerber (RS-274X), Excellon and SVG formats.
• Toolpath Generation: A three-stage pipeline (Translate, Optimize, Process) to convert geometry into machine-ready plans.
• Post-Processors: GRBL, Makera (Experimental), GrblHAL (Experimental), Marlin (Experimental), LinuxCNC (Experimental), UCCNC (Experimental), Mach3 (Experimental), Roland RML (VERY Experimental).

Note: All Experimental post-processors need testing. I only have access to GRBL and Roland machines, be extra cautious. Please report successes or issues so I know and can plan accordingly.

File Compatibility

The application has been developed and tested with files generated from KiCAD and EasyEDA.

• Gerber: .gbr, .ger, .gtl, .gbl, .gts, .gbs, .gko, .gm1
• Excellon: .drl, .xln, .txt, .drill, .exc
• SVG

Note 1: Exporting Gerber files with Protel file extensions allows drag'n'drop to automatically assign files to the expected operation.

Note 2: The parser understands all SVG data including complex Bézier curves and creates the corresponding Cubic or Quadratic primitives. Bézier primitives are then interpolated by the plotter into line segments, as the geometry engine does not support analytic Bézier offsetting, yet.

Usage

Quick Start

1. Load Files: From the Quickstart screen, Drag-and-drop over the preview canvas or use "Add Files" button for each operation type
2. Origin & Machine Settings: Check origin and overall machine parameters for the project
3. Select File: Select a source file object from the Operation Navigation tree to expose related parameters
4. Generate Offsets: Set X&Y axis parameters: passes, stepover and click "Generate Offsets"
5. Preview Toolpath: Define Z axis parameters: cut depth, multi-pass, entry-type and click "Generate Preview"
6. Export G-code: Open Operations Manager, arrange sequence, confirm gcode parameters, preview & export

• Laser: Skips the Preview stage, review generated laser geometry and open the Export Manager to download your SVG or PNG.

The Workflow

The application guides the user through a clear, non-destructive process. Each stage builds on the last, and its visibility can be toggled in the renderer.

Shared Preparation

• Stage 1: Source (Load Geometry)
  • Action: Add Gerber, Excellon or SVG files to the respective operation.
  • Result: The original source geometry is parsed, analyzed and displayed in the renderer.
• Stage 2: Board Placement & Machine Settings
  • Action: Double-check the origin, rotation/mirroring and base machine parameters.
  • Result: Sets the origin, transforms geometry and all machine settings that will affect all your output files.

---

The CNC Workflow

• Stage 3: Offset (Generate Geometry)
  • Action: Configure X/Y parameters (tool diameter, passes, stepover) and click "Generate Offsets".
  • Result: Generates new analytic boundaries for milling, or calculates smart peck/mill strategies for drilling.
• Stage 4: Preview (Simulate Tool Reach)
  • Action: Configure Z parameters (feed rate, plunge rate, cut depth) and click "Generate Preview".
  • Result: Creates a visual simulation stroked with the tool's diameter, showing exactly what material will be removed.
• Stage 5: G-code Export
  • Action: Open the Operations Manager, check the operation order, and click "Calculate Toolpaths".
  • Result: Translates the geometry into optimized machine motion and exports your final G-code file.

---

The Laser Workflow (Beta)

• Stage 3: Laser Path Generation
  • Action: Configure laser parameters (spot size, clear strategy, hatch angle, isolation width) and click "Generate Laser Paths".
  • Result: Generates precise 2D geometry—such as concentric offsets, solid fills, or directional hatch patterns.
• Stage 4: Image Export
  • Action: Open the Export Manager, arrange the operation sequence, assign layer colors, and click "Export".
  • Result: Fuses colinear hatch segments to optimize laser travel time and exports your paths into precision vector (.svg) or high-resolution raster (.png) files.

---

Accessibility

EasyTrace5000 supports keyboard-only navigation and screen readers. See the Accessibility Documentation for complete keyboard controls and WCAG 2.1 compliance details.

Project Structure

<details> <summary><b>View Project Structure</b></summary>

/
├── index.html                            # Eltryus Cam Suite entry
│
├── config.js                             # Configuration and defaults
│
├── cam-core.js                           # Core application logic
├── cam-ui.js                             # UI controller
├── cam-controller.js                     # Initialization and connection
│
├── css/
│   ├── base