@sienci/gviewer 0.1.6 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -376,7 +376,7 @@ viewer.setBitPosition({ x: 10, y: 5, z: 0 }, { immediate: true });
376
376
  viewer.setBitVisible(false);
377
377
  ```
378
378
 
379
- The bit type is controlled via `options.bit.type`. Four types are available:
379
+ The bit type is controlled via `options.bit.type`. Five types are available:
380
380
 
381
381
  | Type | Description |
382
382
  |---|---|
@@ -384,6 +384,7 @@ The bit type is controlled via `options.bit.type`. Four types are available:
384
384
  | `"laser"` | Tapered beam with additive purple glow. Set automatically when `mode.laser` is enabled. |
385
385
  | `"circle"` | Simple sphere. |
386
386
  | `"triangle"` | Cone. |
387
+ | `"crosshair"` | 2D crosshair — intended for use with `GCodeSVGRenderer`. See [Crosshair marker](#crosshair-marker). |
387
388
 
388
389
  **Laser mode auto-switch:** when `mode.laser` is set to `true`, the bit type automatically switches to `"laser"`. When `mode.laser` is set back to `false`, the bit reverts to whatever type was active before laser mode was enabled.
389
390
 
@@ -435,7 +436,7 @@ type GCodeViewerOptions = {
435
436
  mode: { laser: boolean };
436
437
  bit: {
437
438
  enabled: boolean;
438
- type: "drill" | "laser" | "circle" | "triangle"; // default: "drill"
439
+ type: "drill" | "laser" | "circle" | "triangle" | "crosshair"; // default: "drill"
439
440
  size: number; // world units (default: 4.05)
440
441
  opacity: number; // 0–1
441
442
  tweenMs: number; // animation duration
@@ -463,7 +464,7 @@ type GCodeViewerOptions = {
463
464
 
464
465
  ### `GCodeSVGRenderer` — SVG viewer
465
466
 
466
- Lightweight 2D/isometric SVG renderer. No Three.js dependency — works in any environment that has a DOM. Supports orbit (drag to rotate), pan (right-click drag or Shift+drag), and scroll-to-zoom.
467
+ Lightweight 2D/isometric SVG renderer. No Three.js dependency — works in any environment that has a DOM. Supports pan (drag) and scroll-to-zoom.
467
468
 
468
469
  ```ts
469
470
  import { GCodeSVGRenderer } from "@sienci/gviewer/viewer";
@@ -497,12 +498,29 @@ renderer.loadFromWorkerData(workerData);
497
498
  ##### Controls
498
499
 
499
500
  ```ts
500
- renderer.resetView(); // reset rotation and re-fit
501
+ renderer.resetView(); // re-fit view
501
502
  renderer.setProjectionMode("isometric"); // "isometric" (default) | "perspective"
502
503
  renderer.getSVGElement(); // returns the <svg> element (for export, etc.)
503
504
  renderer.dispose(); // remove event listeners and DOM element
504
505
  ```
505
506
 
507
+ ##### Crosshair marker
508
+
509
+ A 2D crosshair can be shown at any world position — useful for indicating the current machine/tool location during job execution. Call `setBitPosition` with the work position (in the same coordinate space as the GCode) and the crosshair will project correctly as the view is panned or zoomed.
510
+
511
+ ```ts
512
+ // Show the crosshair at a work position
513
+ renderer.setBitPosition({ x: 25, y: 50, z: 0 });
514
+
515
+ // Hide without losing the stored position
516
+ renderer.setBitVisible(false);
517
+
518
+ // Show again at the last set position
519
+ renderer.setBitVisible(true);
520
+ ```
521
+
522
+ The crosshair starts hidden and becomes visible on the first `setBitPosition` call. Its color is controlled via `crosshairColor` in `GCodeSVGOptions`.
523
+
506
524
  ##### Options
507
525
 
508
526
  ```ts
@@ -514,6 +532,7 @@ renderer.setOptions({
514
532
  arcSegments: 30, // arc tessellation quality
515
533
  padding: 5, // fixed padding around the fit view (SVG units)
516
534
  projectionMode: "isometric", // "isometric" | "perspective"
535
+ crosshairColor: "#ffffff", // crosshair marker color (default: "#ffffff")
517
536
  });
518
537
  ```
519
538
 
@@ -582,10 +601,14 @@ ref.current?.loadFromText(gcode);
582
601
  ref.current?.loadFromWorkerData(workerData);
583
602
  ref.current?.resetView();
584
603
  ref.current?.setProjectionMode("perspective");
585
- ref.current?.getSVGElement(); // access raw <svg> for export
604
+ ref.current?.getSVGElement(); // access raw <svg> for export
605
+
606
+ // Crosshair — show current machine position during job execution:
607
+ ref.current?.setBitPosition({ x: 25, y: 50, z: 0 });
608
+ ref.current?.setBitVisible(false);
586
609
  ```
587
610
 
588
- `GCodeSVGRendererHandle` exposes: `loadFromLines`, `loadFromFile`, `loadFromText`, `loadFromWorkerData`, `clear`, `resetView`, `setOptions`, `setProjectionMode`, `getSVGElement`, `dispose`.
611
+ `GCodeSVGRendererHandle` exposes: `loadFromLines`, `loadFromFile`, `loadFromText`, `loadFromWorkerData`, `clear`, `resetView`, `setOptions`, `setProjectionMode`, `setBitPosition`, `setBitVisible`, `getSVGElement`, `dispose`.
589
612
 
590
613
  ---
591
614