feat(hiccup-canvas): implement packedLines

packages/hiccup-canvas/src/draw.ts

@@ -10,6 +10,7 @@ import {
 	__restoreState,
 } from "./internal/state.js";
 import { line, lines } from "./line.js";
+import { packedLines } from "./packed-lines.js";
 import { packedPoints } from "./packed-points.js";
 import { path } from "./path.js";
 import { points } from "./points.js";
@@ -69,6 +70,9 @@ export const draw = (
 		case "lines":
 			lines(ctx, attribs, shape[2]);
 			break;
+		case "packedLines":
+			packedLines(ctx, attribs, origAttribs, shape[2]);
+			break;
 		case "hline":
 			line(ctx, attribs, [-1e6, shape[2]], [1e6, shape[2]]);
 			break;

packages/hiccup-canvas/src/packed-lines.ts

@@ -0,0 +1,25 @@
+import type { IObjectOf } from "@thi.ng/api";
+
+export const packedPoints = (
+	ctx: CanvasRenderingContext2D,
+	attribs: IObjectOf<any>,
+	opts: IObjectOf<any>,
+	pts: ArrayLike<number>
+) => {
+	if (attribs.stroke === "none") return;
+	const { start, cstride, estride } = {
+		start: 0,
+		cstride: 1,
+		estride: 2,
+		...opts,
+	};
+	let num =
+		opts && opts.num != null
+			? opts.num
+			: ((pts.length - start) / estride) | 0;
+	ctx.beginPath();
+	for (let i = start + estride; num-- > 1; i += estride) {
+		ctx.lineTo(pts[i], pts[i + cstride]);
+	}
+	ctx.stroke();
+};