smithkit 0.3.0 → 0.5.0

package/dist/lib/traces/TraceRenderer.js

@@ -1,5 +1,7 @@
-import { line } from 'd3';
+import { path, pathRound } from 'd3';
 import { SmithGroup } from '../svg/SmithGroup.js';
+import { TraceLineDetail } from './TraceLineDetail.js';
+import { TraceBuffer } from './TraceBuffer.js';
 /** Draws a trace; sample validation and marker selection belong to TraceModel. */
 export class TraceRenderer {
     data;
@@ -10,6 +12,8 @@ export class TraceRenderer {
     viewportScale = 1;
     visible = true;
     group;
+    lineDetail;
+    lineIndices;
     constructor(data, color, transform, container, scaler, style = {}) {
         this.data = data;
         this.color = color;
@@ -19,6 +23,7 @@ export class TraceRenderer {
             mode: style.mode ?? 'points',
             lineWidth: style.lineWidth ?? 2,
             pointRadius: style.pointRadius ?? 2,
+            lineTolerancePx: style.lineTolerancePx ?? 0,
         };
         this.group = this.drawTrace(data).attr('pointer-events', 'none');
         container.append(this.group);
@@ -32,12 +37,10 @@ export class TraceRenderer {
         group.attr('data-role', 'samples');
         group.attr('data-mode', this.style.mode);
         if (this.style.mode !== 'points') {
-            const path = line()
-                .x((sample) => this.scaler.x(sample.reflectionCoefficient[0]))
-                .y((sample) => this.scaler.y(sample.reflectionCoefficient[1]));
+            this.lineIndices = this.selectLineIndices();
             group.Element.append('path')
                 .attr('class', 'trace-line')
-                .attr('d', path(data))
+                .attr('d', this.linePath(this.lineIndices))
                 .attr('fill', 'none')
                 .attr('stroke', this.color)
                 .attr('stroke-width', this.style.lineWidth)
@@ -50,32 +53,83 @@ export class TraceRenderer {
         }
         return group;
     }
+    selectLineIndices() {
+        if (this.style.lineTolerancePx === 0) {
+            return;
+        }
+        this.lineDetail ??= new TraceLineDetail(this.data);
+        const unitsToPixels = Math.max(Math.abs(this.scaler.x(1) - this.scaler.x(0)), Math.abs(this.scaler.y(1) - this.scaler.y(0))) *
+            this.transform.k *
+            this.viewportScale;
+        return this.lineDetail.select(this.style.lineTolerancePx / unitsToPixels);
+    }
+    linePath(indices) {
+        // Simplified paths retain numeric precision even at high zoom. Full paths keep
+        // the existing SVG serialization; the tolerance measures additional simplification.
+        const line = indices ? path() : pathRound(3);
+        const length = indices?.length ?? this.data.length;
+        for (let position = 0; position < length; position++) {
+            const index = indices ? indices[position] : position;
+            const x = this.scaler.x(this.data.real(index));
+            const y = this.scaler.y(this.data.imaginary(index));
+            if (position === 0) {
+                line.moveTo(x, y);
+            }
+            else {
+                line.lineTo(x, y);
+            }
+        }
+        if (length === 1) {
+            line.closePath();
+        }
+        return line.toString();
+    }
+    updateLine() {
+        if (this.style.mode === 'points') {
+            return;
+        }
+        const indices = this.selectLineIndices();
+        if (indices !== this.lineIndices) {
+            this.lineIndices = indices;
+            this.group.Element.select('.trace-line').attr('d', this.linePath(indices));
+        }
+    }
+    /** Replace geometry only in the export copy, never in the live SVG. */
+    fullExportLine() {
+        const node = this.group.Element.select('.trace-line').node();
+        if (node && this.lineIndices) {
+            return { node, path: this.linePath() };
+        }
+        return;
+    }
     renderPoints(group, data) {
-        let visible = data;
-        if (data.length > 5000) {
-            const cells = new Set();
-            const cellSize = Math.max(0.5, this.style.pointRadius) / this.viewportScale;
-            const extent = this.scaler.x(1);
-            const margin = this.style.pointRadius / this.viewportScale;
-            visible = data.filter((sample) => {
-                const x = this.scaler.x(sample.reflectionCoefficient[0]) * this.transform.k + this.transform.x;
-                const y = this.scaler.y(sample.reflectionCoefficient[1]) * this.transform.k + this.transform.y;
+        const visible = [];
+        const cells = new Set();
+        const cellSize = Math.max(0.5, this.style.pointRadius) / this.viewportScale;
+        const extent = this.scaler.x(1);
+        const margin = this.style.pointRadius / this.viewportScale;
+        const firstCell = Math.floor(-margin / cellSize);
+        const columns = Math.floor((extent + margin) / cellSize) - firstCell + 1;
+        for (let i = 0; i < data.length; i++) {
+            if (data.length > 5000) {
+                const x = this.scaler.x(data.real(i)) * this.transform.k + this.transform.x;
+                const y = this.scaler.y(data.imaginary(i)) * this.transform.k + this.transform.y;
                 if (x < -margin || y < -margin || x > extent + margin || y > extent + margin) {
-                    return false;
+                    continue;
                 }
-                const cell = `${Math.floor(x / cellSize)},${Math.floor(y / cellSize)}`;
+                const cell = (Math.floor(y / cellSize) - firstCell) * columns + Math.floor(x / cellSize) - firstCell;
                 if (cells.has(cell)) {
-                    return false;
+                    continue;
                 }
                 cells.add(cell);
-                return true;
-            });
+            }
+            visible.push(i);
         }
         group.Element.selectAll('circle')
             .data(visible)
             .join('circle')
-            .attr('cx', (sample) => this.scaler.x(sample.reflectionCoefficient[0]))
-            .attr('cy', (sample) => this.scaler.y(sample.reflectionCoefficient[1]))
+            .attr('cx', (index) => this.scaler.x(data.real(index)))
+            .attr('cy', (index) => this.scaler.y(data.imaginary(index)))
             .attr('r', this.style.pointRadius / (this.transform.k * this.viewportScale));
     }
     setViewportScale(scale) {
@@ -90,6 +144,7 @@ export class TraceRenderer {
         this.zoomDataPoints();
     }
     zoomDataPoints() {
+        this.updateLine();
         const k = this.transform.k;
         if (this.style.mode === 'line') {
             return;
@@ -114,10 +169,12 @@ export class TraceRenderer {
             mode: options.mode ?? this.style.mode,
             lineWidth: options.lineWidth ?? this.style.lineWidth,
             pointRadius: options.pointRadius ?? this.style.pointRadius,
+            lineTolerancePx: options.lineTolerancePx ?? this.style.lineTolerancePx,
         };
         if (next.mode === this.style.mode &&
             next.lineWidth === this.style.lineWidth &&
-            next.pointRadius === this.style.pointRadius) {
+            next.pointRadius === this.style.pointRadius &&
+            next.lineTolerancePx === this.style.lineTolerancePx) {
             return;
         }
         const modeChanged = next.mode !== this.style.mode;
@@ -143,10 +200,13 @@ export class TraceRenderer {
     }
     update(data) {
         this.data = data;
+        this.lineDetail = undefined;
         this.redraw();
     }
     destroy() {
-        this.data = [];
+        this.lineDetail = undefined;
+        this.lineIndices = undefined;
+        this.data = TraceBuffer.empty();
         this.group.Element.remove();
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "smithkit",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "description": "Framework-independent, interactive Smith chart library for JavaScript and TypeScript",
   "type": "module",
   "scripts": {
@@ -21,7 +21,9 @@
     "format:check": "prettier . --check",
     "check:package": "node scripts/check-package.mjs",
     "check:example": "node scripts/check-example.mjs",
-    "prepare:release": "node scripts/prepare-release.mjs"
+    "prepare:release": "node scripts/prepare-release.mjs",
+    "benchmark:traces": "node scripts/benchmark-traces.mjs",
+    "benchmark:workloads": "node scripts/benchmark-workloads.mjs"
   },
   "dependencies": {
     "@types/d3": "^7.4.3",