smithkit 0.0.0-stage → 0.1.0

package/dist/lib/draw/SmithCursor.js

@@ -0,0 +1,186 @@
+import { SmithGroup } from './SmithGroup.js';
+import { SmithCircle } from './SmithCircle.js';
+import { SmithLine } from './SmithLine.js';
+import { SmithArc } from './SmithArc.js';
+import { SmithConstantCircle } from '../SmithConstantCircle.js';
+import { Complex } from '../complex/Complex.js';
+export class SmithCursor {
+    scaler;
+    epsilon = 1.5e-4;
+    pendingMove;
+    drawingOpts = {
+        point: { radius: 5, color: 'red' },
+        impedance: { width: 1, color: 'red' },
+        admittance: { width: 1, color: 'green' },
+    };
+    calcs = new SmithConstantCircle();
+    zClipCircle = this.calcs.resistanceCircle(0);
+    yClipCircle = this.calcs.conductanceCircle(0);
+    rc = Complex.from(0, 0);
+    group;
+    point;
+    impedance;
+    admittance;
+    moveHandler = null;
+    constructor(scaler) {
+        this.scaler = scaler;
+        this.group = new SmithGroup().attr('pointer-events', 'none');
+        this.impedance = {
+            group: new SmithGroup({
+                stroke: this.drawingOpts.impedance.color,
+                strokeWidth: this.drawingOpts.impedance.width.toString(),
+                fill: 'none',
+            }),
+            resistance: { circle: new SmithCircle({ p: [0, 0], r: 1 }) },
+            reactance: {
+                arc: new SmithArc([1, 0], [0, 1], 5, false, false),
+                line: new SmithLine([-1, 0], [1, 0]),
+            },
+        };
+        this.impedance.resistance.circle.nonScalingStroke();
+        this.impedance.reactance.arc.nonScalingStroke();
+        this.impedance.reactance.line.nonScalingStroke();
+        this.admittance = {
+            group: new SmithGroup({
+                stroke: this.drawingOpts.admittance.color,
+                strokeWidth: this.drawingOpts.admittance.width.toString(),
+                fill: 'none',
+            }),
+            conductance: { circle: new SmithCircle({ p: [0, 0], r: 1 }) },
+            susceptance: {
+                arc: new SmithArc([1, 0], [0, 1], 5, false, false),
+                line: new SmithLine([-1, 0], [1, 0]),
+            },
+        };
+        this.admittance.conductance.circle.nonScalingStroke();
+        this.admittance.susceptance.arc.nonScalingStroke();
+        this.admittance.susceptance.line.nonScalingStroke();
+        this.point = new SmithLine([0, 0], [0, 0], {
+            stroke: this.drawingOpts.point.color,
+            strokeWidth: this.drawingOpts.point.radius.toString(),
+            fill: 'none',
+        });
+        this.point.nonScalingStroke();
+        this.point.setStrokeLinecap('round');
+        this.hide();
+        this.appendAll();
+    }
+    appendAll() {
+        this.impedance.group
+            .append(this.impedance.resistance.circle)
+            .append(this.impedance.reactance.arc)
+            .append(this.impedance.reactance.line);
+        this.admittance.group
+            .append(this.admittance.conductance.circle)
+            .append(this.admittance.susceptance.arc)
+            .append(this.admittance.susceptance.line);
+        this.group.append(this.admittance.group).append(this.impedance.group).append(this.point);
+    }
+    get Group() {
+        return this.group;
+    }
+    get Position() {
+        return this.rc;
+    }
+    set Position(rc) {
+        if (this.isWithinPlot(rc) === false) {
+            this.hide();
+            return;
+        }
+        this.rc = rc;
+        const z = this.calcs.rflCoeffToImpedance(rc);
+        const y = this.calcs.rflCoeffToAdmittance(rc);
+        this.movePoint(rc);
+        this.moveResistance(z);
+        this.moveReactance(z);
+        this.moveConductance(y);
+        this.moveSusceptance(y);
+        this.show();
+        this.cancelPendingMove();
+        this.pendingMove = setTimeout(() => {
+            this.pendingMove = undefined;
+            if (this.moveHandler) {
+                this.moveHandler(rc);
+            }
+        }, 0);
+    }
+    isWithinPlot(p) {
+        return this.calcs.isPointWithinCircle([p.re, p.im], this.zClipCircle);
+    }
+    movePoint(rc) {
+        const p = rc.toVector();
+        this.point.move(this.scaler.point(p), this.scaler.point(p));
+    }
+    moveResistance(z) {
+        if (z === undefined) {
+            this.impedance.resistance.circle.hide();
+            return;
+        }
+        this.impedance.resistance.circle.show();
+        const c = this.scaler.circle(this.calcs.resistanceCircle(z.re));
+        this.impedance.resistance.circle.move(c);
+    }
+    moveReactance(z) {
+        if (z === undefined || Math.abs(z.im) < this.epsilon) {
+            this.impedance.reactance.line.move(this.scaler.point([-1, 0]), this.scaler.point([1, 0]));
+            this.impedance.reactance.line.show();
+            this.impedance.reactance.arc.hide();
+            return;
+        }
+        this.impedance.reactance.line.hide();
+        this.impedance.reactance.arc.show();
+        const c = this.calcs.reactanceCircle(z.im);
+        const p = this.calcs.circleCircleIntersection(c, this.zClipCircle);
+        p[0] = this.scaler.point(p[0]);
+        p[1] = this.scaler.point(p[1]);
+        c.r = this.scaler.r(c.r);
+        this.impedance.reactance.arc.move(p[0], p[1], c.r, false, true);
+    }
+    moveConductance(y) {
+        if (y === undefined) {
+            this.admittance.conductance.circle.hide();
+            return;
+        }
+        this.admittance.conductance.circle.show();
+        const c = this.scaler.circle(this.calcs.conductanceCircle(y.re));
+        this.admittance.conductance.circle.move(c);
+    }
+    moveSusceptance(y) {
+        if (y === undefined || Math.abs(y.im) < this.epsilon) {
+            this.admittance.susceptance.line.move(this.scaler.point([-1, 0]), this.scaler.point([1, 0]));
+            this.admittance.susceptance.line.show();
+            this.admittance.susceptance.arc.hide();
+            return;
+        }
+        this.admittance.susceptance.line.hide();
+        this.admittance.susceptance.arc.show();
+        const c = this.calcs.susceptanceCircle(y.im);
+        const p = this.calcs.circleCircleIntersection(c, this.yClipCircle);
+        p[0] = this.scaler.point(p[0]);
+        p[1] = this.scaler.point(p[1]);
+        c.r = this.scaler.r(c.r);
+        this.admittance.susceptance.arc.move(p[0], p[1], c.r, false, true);
+    }
+    show() {
+        this.group.show();
+    }
+    hide() {
+        this.cancelPendingMove();
+        this.group.hide();
+    }
+    cancelPendingMove() {
+        if (this.pendingMove !== undefined) {
+            clearTimeout(this.pendingMove);
+            this.pendingMove = undefined;
+        }
+    }
+    setMoveHandler(handler) {
+        this.moveHandler = handler;
+        if (handler === null) {
+            this.cancelPendingMove();
+        }
+    }
+    setDrawOptions(opts) {
+        this.drawingOpts = opts;
+    }
+}

package/dist/lib/draw/SmithData.d.ts

@@ -0,0 +1,66 @@
+import { SmithGroup } from './SmithGroup.js';
+import type { TraceStyle, MarkerSelectionStrategy } from '../measurements.js';
+import { SmithMarker } from './SmithMarker.js';
+import { SmithScaler } from './SmithScaler.js';
+import { TraceSamples, TraceSample } from '../samples.js';
+interface Marker {
+    marker: SmithMarker;
+    selectedPoint: TraceSample;
+    number: number;
+}
+interface Transform {
+    x: number;
+    y: number;
+    k: number;
+}
+export declare class SmithData {
+    private data;
+    private color;
+    private transform;
+    private fgContainer;
+    private scaler;
+    private markerDragHandler?;
+    private markerContainer;
+    private style;
+    private viewportScale;
+    private destroyed;
+    private visible;
+    private pendingEvents;
+    private group;
+    private markersCount;
+    private markers;
+    private handler;
+    constructor(data: TraceSamples, color: string, transform: Transform, fgContainer: SmithGroup, scaler: SmithScaler, markerDragHandler?: ((marker: SmithMarker, dragging: boolean) => void) | undefined, markerContainer?: SmithGroup, style?: Partial<TraceStyle>);
+    private drawTrace;
+    private renderPoints;
+    setViewportScale(scale: number): void;
+    zoom(transform: Transform): void;
+    private zoomDataPoints;
+    private zoomAllMarkers;
+    addMarker(sampleIndex?: number): number;
+    removeMarker(index: number): boolean;
+    setMarkerSample(index: number, sampleIndex: number): boolean;
+    setMarkerFrequency(index: number, frequencyHz: number): boolean;
+    private nearestFrequencyIndex;
+    private validateSampleIndex;
+    get Samples(): TraceSamples;
+    get SampleCount(): number;
+    get Color(): string;
+    get Visible(): boolean;
+    markerSampleIndex(index: number): number;
+    setColor(color: string): void;
+    get Style(): TraceStyle;
+    setStyle(options: Partial<TraceStyle>): void;
+    private redraw;
+    setVisible(visible: boolean): void;
+    private copySamples;
+    private notifyMarker;
+    private cancelEvents;
+    update(values: TraceSamples, strategy?: MarkerSelectionStrategy): void;
+    destroy(): void;
+    getMarker(index: number): Marker | undefined;
+    get Markers(): Marker[];
+    setMarkerMoveHandler(handler: (marker: number, data: TraceSample) => void): void;
+    private findClosestPointTo;
+}
+export {};

package/dist/lib/draw/SmithData.js

@@ -0,0 +1,366 @@
+import { SmithGroup } from './SmithGroup.js';
+import { line } from 'd3';
+import { SmithMarker } from './SmithMarker.js';
+export class SmithData {
+    data;
+    color;
+    transform;
+    fgContainer;
+    scaler;
+    markerDragHandler;
+    markerContainer;
+    style;
+    viewportScale = 1;
+    destroyed = false;
+    visible = true;
+    pendingEvents = new Map();
+    group;
+    markersCount = 0;
+    markers = [];
+    handler = null;
+    constructor(data, color, transform, fgContainer, scaler, markerDragHandler, markerContainer = fgContainer, style = {}) {
+        this.data = data;
+        this.color = color;
+        this.transform = transform;
+        this.fgContainer = fgContainer;
+        this.scaler = scaler;
+        this.markerDragHandler = markerDragHandler;
+        this.markerContainer = markerContainer;
+        this.style = {
+            mode: style.mode ?? 'points',
+            lineWidth: style.lineWidth ?? 2,
+            pointRadius: style.pointRadius ?? 2,
+        };
+        this.data = this.copySamples(data);
+        this.group = this.drawTrace(this.data);
+        this.group.attr('pointer-events', 'none');
+        this.fgContainer.append(this.group);
+        this.zoomDataPoints();
+    }
+    drawTrace(data) {
+        const group = new SmithGroup({
+            stroke: 'none',
+            strokeWidth: 'none',
+            fill: this.color,
+        });
+        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]));
+            group.Element.append('path')
+                .attr('class', 'trace-line')
+                .attr('d', path(data))
+                .attr('fill', 'none')
+                .attr('stroke', this.color)
+                .attr('stroke-width', this.style.lineWidth)
+                .attr('vector-effect', 'non-scaling-stroke')
+                .attr('stroke-linejoin', 'round')
+                .attr('stroke-linecap', 'round');
+        }
+        if (this.style.mode !== 'line') {
+            this.renderPoints(group, data);
+        }
+        return group;
+    }
+    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;
+                if (x < -margin || y < -margin || x > extent + margin || y > extent + margin) {
+                    return false;
+                }
+                const cell = `${Math.floor(x / cellSize)},${Math.floor(y / cellSize)}`;
+                if (cells.has(cell)) {
+                    return false;
+                }
+                cells.add(cell);
+                return true;
+            });
+        }
+        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('r', this.style.pointRadius / (this.transform.k * this.viewportScale));
+    }
+    setViewportScale(scale) {
+        if (scale === this.viewportScale || !Number.isFinite(scale) || scale <= 0) {
+            return;
+        }
+        this.viewportScale = scale;
+        this.zoomDataPoints();
+    }
+    zoom(transform) {
+        if (this.destroyed) {
+            return;
+        }
+        this.transform = transform;
+        this.zoomDataPoints();
+        this.zoomAllMarkers();
+    }
+    zoomDataPoints() {
+        const k = this.transform.k;
+        if (this.style.mode === 'line') {
+            return;
+        }
+        if (this.data.length > 5000) {
+            this.renderPoints(this.group, this.data);
+        }
+        else {
+            this.group.Element.selectAll('circle').attr('r', this.style.pointRadius / (k * this.viewportScale));
+        }
+    }
+    zoomAllMarkers() {
+        const k = this.transform.k;
+        for (const marker of this.markers) {
+            const entry = marker.selectedPoint;
+            if (entry) {
+                marker.marker.zoom(k);
+            }
+        }
+    }
+    addMarker(sampleIndex = 0) {
+        if (this.destroyed) {
+            throw new Error('This dataset has been removed.');
+        }
+        this.validateSampleIndex(sampleIndex);
+        const markerIndex = this.markersCount++;
+        const marker = new SmithMarker(markerIndex + 1, this.color, (dragging) => this.markerDragHandler?.(marker, dragging));
+        const markerDesc = {
+            marker,
+            selectedPoint: this.data[sampleIndex],
+            number: markerIndex + 1,
+        };
+        this.markers.push(markerDesc);
+        marker.Element.attr('data-role', 'marker');
+        this.markerContainer.append(marker);
+        marker.setDragHandler((mp) => {
+            const dp = this.findClosestPointTo(this.scaler.pointInvert(mp));
+            if (markerDesc.selectedPoint === dp) {
+                return;
+            }
+            markerDesc.selectedPoint = dp;
+            marker.move(this.scaler.point(dp.reflectionCoefficient));
+            marker.zoom(this.transform.k);
+            this.notifyMarker(markerDesc);
+        });
+        marker.zoom(this.transform.k);
+        marker.show();
+        marker.move(this.scaler.point(markerDesc.selectedPoint.reflectionCoefficient));
+        marker.Element.style('display', () => (this.visible ? null : 'none'));
+        this.notifyMarker(markerDesc);
+        return this.markers.length - 1;
+    }
+    removeMarker(index) {
+        const entry = this.markers[index];
+        if (!entry) {
+            return false;
+        }
+        clearTimeout(this.pendingEvents.get(entry));
+        this.pendingEvents.delete(entry);
+        entry.marker.destroy();
+        this.markers.splice(index, 1);
+        return true;
+    }
+    setMarkerSample(index, sampleIndex) {
+        const entry = this.markers[index];
+        if (!entry) {
+            return false;
+        }
+        this.validateSampleIndex(sampleIndex);
+        entry.selectedPoint = this.data[sampleIndex];
+        entry.marker.move(this.scaler.point(entry.selectedPoint.reflectionCoefficient));
+        this.notifyMarker(entry);
+        return true;
+    }
+    setMarkerFrequency(index, frequencyHz) {
+        if (!this.markers[index]) {
+            return false;
+        }
+        if (!Number.isFinite(frequencyHz) || frequencyHz < 0) {
+            throw new RangeError('Marker frequency must be finite and non-negative.');
+        }
+        return this.setMarkerSample(index, this.nearestFrequencyIndex(frequencyHz));
+    }
+    nearestFrequencyIndex(frequencyHz) {
+        let closest = 0;
+        let distance = Math.abs(this.data[0].frequencyHz - frequencyHz);
+        for (let i = 1; i < this.data.length; i++) {
+            const nextDistance = Math.abs(this.data[i].frequencyHz - frequencyHz);
+            if (nextDistance < distance) {
+                closest = i;
+                distance = nextDistance;
+            }
+        }
+        return closest;
+    }
+    validateSampleIndex(index) {
+        if (!Number.isInteger(index) || index < 0 || index >= this.data.length) {
+            throw new RangeError('Sample index is outside this trace.');
+        }
+    }
+    get Samples() {
+        return this.data;
+    }
+    get SampleCount() {
+        return this.data.length;
+    }
+    get Color() {
+        return this.color;
+    }
+    get Visible() {
+        return this.visible;
+    }
+    markerSampleIndex(index) {
+        const entry = this.markers[index];
+        return entry ? this.data.indexOf(entry.selectedPoint) : -1;
+    }
+    setColor(color) {
+        this.color = color;
+        this.group.attr('fill', color);
+        this.group.Element.select('.trace-line').attr('stroke', color);
+        this.markers.forEach(({ marker }) => marker.setColor(color));
+    }
+    get Style() {
+        return { ...this.style };
+    }
+    setStyle(options) {
+        const next = {
+            mode: options.mode ?? this.style.mode,
+            lineWidth: options.lineWidth ?? this.style.lineWidth,
+            pointRadius: options.pointRadius ?? this.style.pointRadius,
+        };
+        if (next.mode === this.style.mode &&
+            next.lineWidth === this.style.lineWidth &&
+            next.pointRadius === this.style.pointRadius) {
+            return;
+        }
+        const modeChanged = next.mode !== this.style.mode;
+        this.style = next;
+        if (modeChanged) {
+            this.redraw();
+        }
+        else {
+            this.group.Element.select('.trace-line').attr('stroke-width', next.lineWidth);
+            this.zoomDataPoints();
+        }
+    }
+    redraw() {
+        const group = this.drawTrace(this.data).attr('pointer-events', 'none');
+        // Replace in place to retain trace ordering beneath the separate marker layer.
+        this.group.Node.replaceWith(group.Node);
+        this.group = group;
+        this.group.Element.style('display', () => (this.visible ? null : 'none'));
+    }
+    setVisible(visible) {
+        this.visible = visible;
+        this.group.Element.style('display', () => (visible ? null : 'none'));
+        this.markers.forEach(({ marker }) => {
+            if (!visible) {
+                marker.cancelDrag();
+            }
+            marker.Element.style('display', () => (visible ? null : 'none'));
+        });
+    }
+    copySamples(values) {
+        if (!values.length ||
+            values.some(({ frequencyHz, reflectionCoefficient }) => !Number.isFinite(frequencyHz) ||
+                frequencyHz < 0 ||
+                reflectionCoefficient.length !== 2 ||
+                !reflectionCoefficient.every(Number.isFinite))) {
+            throw new RangeError('A dataset requires samples with a non-negative finite frequency and two finite coordinates.');
+        }
+        return values.map(({ frequencyHz, reflectionCoefficient }) => ({
+            frequencyHz,
+            reflectionCoefficient: [reflectionCoefficient[0], reflectionCoefficient[1]],
+        }));
+    }
+    notifyMarker(entry) {
+        if (this.pendingEvents.has(entry)) {
+            return;
+        }
+        const timer = setTimeout(() => {
+            this.pendingEvents.delete(entry);
+            const index = this.markers.indexOf(entry);
+            if (!this.destroyed && index >= 0) {
+                this.handler?.(index, entry.selectedPoint);
+            }
+        }, 0);
+        this.pendingEvents.set(entry, timer);
+    }
+    cancelEvents() {
+        this.pendingEvents.forEach((timer) => clearTimeout(timer));
+        this.pendingEvents.clear();
+    }
+    update(values, strategy = 'frequency') {
+        if (this.destroyed) {
+            throw new Error('This dataset has been removed.');
+        }
+        const samples = this.copySamples(values);
+        const selectedIndices = this.markers.map((entry) => this.data.indexOf(entry.selectedPoint));
+        this.cancelEvents();
+        this.data = samples;
+        const group = this.drawTrace(samples).attr('pointer-events', 'none');
+        this.group.Element.remove();
+        this.group = group;
+        this.group.Element.style('display', () => (this.visible ? null : 'none'));
+        this.fgContainer.append(group);
+        this.zoomDataPoints();
+        this.markers.forEach((entry, index) => {
+            if (strategy === 'sample-index') {
+                entry.selectedPoint = samples[Math.min(selectedIndices[index], samples.length - 1)];
+            }
+            else if (strategy === 'reflection') {
+                entry.selectedPoint = this.findClosestPointTo(entry.selectedPoint.reflectionCoefficient);
+            }
+            else {
+                entry.selectedPoint = samples[this.nearestFrequencyIndex(entry.selectedPoint.frequencyHz)];
+            }
+            entry.marker.move(this.scaler.point(entry.selectedPoint.reflectionCoefficient));
+            this.notifyMarker(entry);
+        });
+    }
+    destroy() {
+        if (this.destroyed) {
+            return;
+        }
+        this.destroyed = true;
+        this.cancelEvents();
+        this.handler = null;
+        this.markers.forEach(({ marker }) => marker.destroy());
+        this.markers = [];
+        this.markerDragHandler = undefined;
+        this.data = [];
+        this.group.Element.remove();
+    }
+    getMarker(index) {
+        return this.markers[index];
+    }
+    get Markers() {
+        return this.markers.slice();
+    }
+    setMarkerMoveHandler(handler) {
+        this.handler = handler;
+    }
+    findClosestPointTo(p) {
+        const dist = (p1, p2) => {
+            const xd = p1[0] - p2[0];
+            const yd = p1[1] - p2[1];
+            return Math.hypot(xd, yd);
+        };
+        return this.data.reduce((prev, curr) => {
+            const d1 = dist(p, prev.reflectionCoefficient);
+            const d2 = dist(p, curr.reflectionCoefficient);
+            return d1 <= d2 ? prev : curr;
+        });
+    }
+}

package/dist/lib/draw/SmithDrawOptions.d.ts

@@ -0,0 +1,5 @@
+export interface SmithDrawOptions {
+    stroke?: string;
+    strokeWidth?: string;
+    fill?: string;
+}

package/dist/lib/draw/SmithDrawOptions.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/draw/SmithGridLayer.d.ts

@@ -0,0 +1,19 @@
+import { ConstCircles } from './ConstCircles.js';
+import { SmithGroup } from './SmithGroup.js';
+import type { SmithScaler } from './SmithScaler.js';
+import type { SmithTicksData } from '../grid/types.js';
+import { type GridKind } from '../grid/geometry.js';
+export interface GridLayerParams {
+    scaler: SmithScaler;
+    showMinor: boolean;
+    data: SmithTicksData;
+}
+/** SVG adapter shared by the four constant impedance/admittance layers. */
+export declare class SmithGridLayer extends ConstCircles {
+    private kind;
+    protected major: SmithGroup;
+    protected minor: SmithGroup;
+    protected texts: SmithGroup;
+    constructor(params: GridLayerParams, kind: GridKind);
+    private drawGrid;
+}

package/dist/lib/draw/SmithGridLayer.js

@@ -0,0 +1,48 @@
+import { ConstCircles } from './ConstCircles.js';
+import { SmithGroup } from './SmithGroup.js';
+import { SmithText } from './SmithText.js';
+import { gridGeometry, gridLabel } from '../grid/geometry.js';
+import { resistanceLabels, reactanceLabels } from '../grid/labels.js';
+/** SVG adapter shared by the four constant impedance/admittance layers. */
+export class SmithGridLayer extends ConstCircles {
+    kind;
+    major;
+    minor;
+    texts;
+    constructor(params, kind) {
+        super(params.scaler);
+        this.kind = kind;
+        const real = kind === 'resistance' || kind === 'conductance';
+        const definitions = params.data[real ? 'resistance' : 'reactance'];
+        this.major = this.drawGrid(definitions.major, this.opts.majorWidth);
+        this.minor = this.drawGrid(definitions.minor, this.opts.minorWidth);
+        this.texts = new SmithGroup()
+            .attr('stroke', 'none')
+            .attr('font-size', '7')
+            .attr('font-family', 'Verdana');
+        for (const tick of real ? resistanceLabels() : reactanceLabels()) {
+            const label = gridLabel(kind, tick.definition);
+            this.texts.append(new SmithText(this.scaler.point(label.point), label.text, {
+                rotate: label.rotate,
+                dx: this.scaler.r(label.dx).toString(),
+                dy: this.scaler.r(label.dy).toString(),
+                textAnchor: label.textAnchor,
+                dominantBaseline: label.dominantBaseline,
+            }));
+        }
+        this.build();
+        if (!params.showMinor) {
+            this.minor.hide();
+        }
+    }
+    drawGrid(definitions, width) {
+        const geometry = gridGeometry(this.kind, definitions);
+        const group = new SmithGroup();
+        this.drawShapes(group.Element, this.opts.stroke, width, {
+            lines: geometry.lines.map((line) => this.scaler.line(line)),
+            circles: geometry.circles.map((circle) => this.scaler.circle(circle)),
+            arcs: geometry.arcs.map((arc) => this.scaleArc(this.scaler, arc)),
+        });
+        return group;
+    }
+}