ggaction 0.0.18 → 0.0.19

package/src/renderers/canvas/isolated.js

@@ -0,0 +1,166 @@
+import { resolvePrimitiveGraphicBounds } from "../../grammar/schemas/graphicBounds.js";
+import { walkGraphicTreeEvents } from "../../grammar/schemas/graphicTree.js";
+import { MAX_RASTER_DIMENSION, MAX_RASTER_PIXELS } from "./limits.js";
+
+function canvasFactory(context, supplied) {
+  if (supplied !== undefined) return supplied;
+  const canvas = context.canvas;
+  if (typeof canvas?.ownerDocument?.createElement === "function") {
+    return (width, height) => {
+      const source = canvas.ownerDocument.createElement("canvas");
+      source.width = width;
+      source.height = height;
+      return source;
+    };
+  }
+  if (canvas?.constructor && canvas.constructor !== Object) {
+    return (width, height) => new canvas.constructor(width, height);
+  }
+  throw new TypeError("Isolated glyph painting requires a compatible Canvas surface.");
+}
+
+function requireSurface(surface) {
+  const context = surface?.getContext?.("2d");
+  if (!context || ["save", "restore", "scale", "translate", "beginPath", "fillRect",
+    "fill", "stroke", "moveTo", "lineTo", "bezierCurveTo", "closePath", "setLineDash"]
+    .some(method => typeof context[method] !== "function")) {
+    throw new TypeError("Isolated glyph painting requires a compatible Canvas 2D surface.");
+  }
+  return context;
+}
+
+// This is renderer-private state: no surface or backend object enters graphicSpec.
+export function prepareIsolatedGlyphs(target, context, { pixelRatio = 1, createCanvas } = {}) {
+  const requested = Object.values(target.graphicSpec.objects).some(object =>
+    ["normal","difference"].includes(object.properties?.blend) ||
+    object.items?.some(item => ["normal","difference"].includes(item.properties?.blend)));
+  if (!requested) return undefined;
+  if (typeof context.drawImage !== "function" || typeof context.globalCompositeOperation !== "string") {
+    throw new TypeError("Isolated glyph painting requires Canvas drawImage and compositing support.");
+  }
+  const factory = canvasFactory(context, createCanvas);
+  let surface;
+  try {
+    surface = factory(1, 1);
+    const source = requireSurface(surface);
+    const hasGradient = Object.values(target.graphicSpec.objects).some(object =>
+      [object, ...(object.items ?? [])].some(item =>
+        ["normal","difference"].includes(item.properties?.blend) && item.properties.fill?.type === "linear-gradient"));
+    const normal=Object.values(target.graphicSpec.objects).some(object=>
+      [object,...(object.items??[])].some(item=>item.properties?.blend==="normal"));
+    if(normal){
+      if(typeof source.setTransform!=="function")throw new TypeError("Normal glyph opacity requires Canvas transform support.");
+      source.save();try{
+        source.globalCompositeOperation="destination-in";
+        if(source.globalCompositeOperation!=="destination-in")throw new TypeError("Normal glyph opacity requires source attenuation.");
+      }finally{source.restore();}
+      const circle=Object.values(target.graphicSpec.objects).some(object=>
+        [object,...(object.items??[])].some(item=>item.properties?.blend==="normal"&&(item.type??object.type)==="circle"));
+      if(circle&&typeof source.arc!=="function")throw new TypeError("Normal circle painting requires Canvas arcs.");
+    }
+    if (hasGradient && (typeof source.createLinearGradient !== "function" ||
+        typeof source.createLinearGradient(0, 0, 1, 0)?.addColorStop !== "function")) {
+      throw new TypeError("Isolated gradient painting requires Canvas linear gradients.");
+    }
+  } catch (error) {
+    throw new TypeError("Isolated glyph painting requires a compatible Canvas surface.", {cause:error});
+  }
+  context.save();
+  try {
+    const modes=new Set();
+    for(const object of Object.values(target.graphicSpec.objects))for(const item of [object,...(object.items??[])]){
+      if(item.properties?.blend!==undefined)modes.add(item.properties.blend==="normal"?"source-over":item.properties.blend);
+    }
+    for(const mode of modes){
+      context.globalCompositeOperation=mode;
+      if(context.globalCompositeOperation!==mode)throw new TypeError(`Canvas context does not support ${mode} compositing.`);
+    }
+  } finally { context.restore(); }
+
+  const plans = new Map();
+  // Ordered root graphics may be siblings of the Canvas, not its descendants.
+  const frames = [{offset:[0,0],clip:{left:0,top:0,right:target.width,bottom:target.height}}];
+  function plan(id, object, type) {
+    const properties = object.properties;
+    if (!["normal","difference"].includes(properties?.blend)) return;
+    const bounds = resolvePrimitiveGraphicBounds(type, properties);
+    if (!bounds) throw new Error(`Graphic "${id}" requires finite isolated paint bounds.`);
+    const {offset: [x, y], clip} = frames.at(-1);
+    const clipped = {
+      left: Math.max(bounds.left + x, clip.left),
+      right: Math.min(bounds.right + x, clip.right),
+      top: Math.max(bounds.top + y, clip.top),
+      bottom: Math.min(bounds.bottom + y, clip.bottom)
+    };
+    if (clipped.right <= clipped.left || clipped.bottom <= clipped.top) {
+      plans.set(id, {empty: true});
+      return;
+    }
+    // Align to destination pixels, including fractional nested translations.
+    const left = Math.max(Math.floor(clip.left * pixelRatio), Math.floor(clipped.left * pixelRatio) - 1);
+    const top = Math.max(Math.floor(clip.top * pixelRatio), Math.floor(clipped.top * pixelRatio) - 1);
+    const right = Math.min(Math.ceil(clip.right * pixelRatio), Math.ceil(clipped.right * pixelRatio) + 1);
+    const bottom = Math.min(Math.ceil(clip.bottom * pixelRatio), Math.ceil(clipped.bottom * pixelRatio) + 1);
+    const width = right - left, height = bottom - top;
+    if (![width, height].every(Number.isSafeInteger) || width < 1 || height < 1 ||
+        width > MAX_RASTER_DIMENSION || height > MAX_RASTER_DIMENSION ||
+        width * height > MAX_RASTER_PIXELS) {
+      throw new RangeError(`Graphic "${id}" isolated paint surface exceeds the raster allocation limit.`);
+    }
+    plans.set(id, {width, height, left: left / pixelRatio - x, top: top / pixelRatio - y});
+  }
+  walkGraphicTreeEvents(target.graphicSpec, {
+    enter({id, object}) {
+      if (object.type === "canvas") {
+        const parent = frames.at(-1);
+        const offset = id === target.canvasId ? [0, 0] :
+          [parent.offset[0] + object.properties.x, parent.offset[1] + object.properties.y];
+        const properties = object.properties;
+        const local = {left: offset[0], top: offset[1],
+          right: offset[0] + properties.width, bottom: offset[1] + properties.height};
+        const clip = {
+          left: Math.max(parent.clip.left, local.left), top: Math.max(parent.clip.top, local.top),
+          right: Math.min(parent.clip.right, local.right), bottom: Math.min(parent.clip.bottom, local.bottom)
+        };
+        frames.push({offset, clip});
+      }
+      if (!object.items) plan(id, object, object.type);
+    },
+    item({id, object, owner}) { plan(id, object, object.type ?? owner.type); },
+    exit({object}) { if (object.type === "canvas") frames.pop(); }
+  });
+  return {plans, surface, pixelRatio};
+}
+
+// Paint fill and outline together with opacity 1, then composite the source once.
+export function drawIsolatedGlyph(context, id, graphic, draw, prepared) {
+  const plan = prepared?.plans.get(id);
+  if (!plan) throw new Error(`Graphic "${id}" has no prepared isolated paint source.`);
+  if (plan.empty) return;
+  const {surface, pixelRatio} = prepared;
+  surface.width = plan.width;
+  surface.height = plan.height;
+  const source = requireSurface(surface);
+  source.scale(pixelRatio, pixelRatio);
+  source.translate(-plan.left, -plan.top);
+  const {blend, opacity = 1, ...properties} = graphic.properties;
+  draw(source, id, {...graphic, properties: {...properties, opacity: 1}});
+  if(blend==="normal"){
+    // Attenuate the complete source once. drawImage(globalAlpha) introduces
+    // additional native image-alpha quantization; source masking avoids it.
+    source.save();
+    try{
+      source.setTransform(1,0,0,1,0,0);
+      source.globalCompositeOperation="destination-in";
+      source.globalAlpha=opacity;
+      source.fillStyle="#fff";
+      source.fillRect(0,0,plan.width,plan.height);
+    }finally{source.restore();}
+  }
+  context.save();
+  try {
+    context.globalAlpha = blend==="normal"?1:opacity;
+    context.globalCompositeOperation = blend==="normal"?"source-over":blend;
+    context.drawImage(surface, plan.left, plan.top, plan.width / pixelRatio, plan.height / pixelRatio);
+  } finally { context.restore(); }
+}

package/src/renderers/canvas/limits.js

@@ -0,0 +1,3 @@
+// Shared raster allocation limits for root canvases and isolated glyph sources.
+export const MAX_RASTER_DIMENSION = 32_767;
+export const MAX_RASTER_PIXELS = 16_777_216;

package/src/renderers/canvas/rect.js

@@ -51,7 +51,7 @@ function drawRect(context, child, collectionId) {
     context.lineTo(x + width, y);
     context.lineTo(x + width, y + height);
     context.lineTo(x, y + height);
-    context.lineTo(x, y);
+    context.closePath();
     context.stroke();
   }
 }

package/src/renderers/pdf.js

@@ -73,10 +73,10 @@ export async function renderToPDFBuffer(program, options = {}) {
   const target = resolveGraphicRenderTarget(graphicSpec);
   requirePDFPageDimensions(target);
   preflightCanvasGraphicSpec(target);
-  const { PDFDocument } = await loadNativeBackend();
+  const { PDFDocument, createCanvas } = await loadNativeBackend();
   const document = new PDFDocument(metadata);
   const context = document.beginPage(target.width, target.height);
-  drawResolvedGraphicSpec(target, context);
+  drawResolvedGraphicSpec(target, context, {createCanvas});
   document.endPage();
   const buffer = document.close();
   return Object.freeze({

package/src/renderers/png.js

@@ -1,6 +1,6 @@
 import { mkdir, writeFile } from "node:fs/promises";
 import { dirname, resolve } from "node:path";
-import { render } from "./canvas/index.js";
+import { renderCanvasProgram } from "./canvas/index.js";
 import { validateRendererOptions } from "./options.js";
 import { loadNativeBackend } from "./nativeBackend.js";
 
@@ -12,7 +12,7 @@ export async function renderToPNGBuffer(program, options = {}) {
   const { pixelRatio = 1 } = options;
   const { createCanvas } = await loadNativeBackend();
   const canvas = createCanvas(1, 1);
-  render(program, canvas.getContext("2d"), { pixelRatio });
+  renderCanvasProgram(program, canvas.getContext("2d"), { pixelRatio }, createCanvas);
   // Canvas drawing is synchronous; encoding uses the native async worker.
   const buffer = await canvas.encode("png");
   return Object.freeze({

package/src/renderers/svg.js

@@ -265,7 +265,8 @@ function serializeRect(state, graphicId, properties) {
     ["stroke", properties.stroke],
     ["stroke-width", formatNumber(strokeWidth)],
     ...strokeDetailAttributes(properties, strokeWidth),
-    ["opacity", formatNumber(requireOpacity(properties, graphicId))]
+    ["opacity", formatNumber(requireOpacity(properties, graphicId))],
+    ["style", properties.blend === "difference" ? "mix-blend-mode:difference" : undefined]
   ]);
 }
 
@@ -362,7 +363,8 @@ function serializePath(state, graphicId, properties) {
     ["stroke-dasharray", strokeDash.length === 0
       ? undefined
       : strokeDash.map(formatNumber).join(" ")],
-    ["opacity", formatNumber(requireOpacity(properties, graphicId))]
+    ["opacity", formatNumber(requireOpacity(properties, graphicId))],
+    ["style", properties.blend === "difference" ? "mix-blend-mode:difference" : undefined]
   ]);
 }
 
@@ -582,6 +584,10 @@ export function renderToSVG(program, options = {}) {
     resourceNamespace:
       resolvedOptions.resourceNamespace ?? resourceNamespace(graphicSpec)
   };
+  walkGraphicTreeEvents(graphicSpec, {
+    enter({object}) { if (object.properties?.blend === "difference") state.hasBlend = true; },
+    item({object}) { if (object.properties?.blend === "difference") state.hasBlend = true; }
+  });
   const body = serializeBody(
     graphicSpec,
     rootId,
@@ -605,6 +611,7 @@ export function renderToSVG(program, options = {}) {
     ["xmlns", SVG_NAMESPACE],
     ["width", formatNumber(width)],
     ["height", formatNumber(height)],
-    ["viewBox", `0 0 ${formatNumber(width)} ${formatNumber(height)}`]
+    ["viewBox", `0 0 ${formatNumber(width)} ${formatNumber(height)}`],
+    ["style", state.hasBlend ? "isolation:isolate" : undefined]
   ], `${accessible}${definitions}${body}`);
 }

package/src/selectors/axes.js

@@ -0,0 +1 @@
+const p=Object.freeze(["x","y"]),w=Object.freeze(["line","ticks","labels","title"]);function x(n){const e=n.semanticSpec?.guides?.axis??{},a=(n.guideConfigs??n.materializationConfigs?.guides)?.axis??{};return[...new Set([...Object.keys(e),...Object.keys(a)])].flatMap(i=>{const s=Object.hasOwn(e,i)?e[i]:void 0,c=Object.hasOwn(a,i)?a[i]:void 0,d=p.includes(i)?i:s?.channel;if(!p.includes(d))return[];const t=[...new Set((n.semanticSpec.layers??[]).filter(f=>f.encoding?.[d]?.scale===s?.scale).map(f=>f.coordinate).filter(Boolean))];return[{id:i,channel:d,semantic:s,config:c,scale:s?.scale,coordinate:s?.coordinate??(t.length===1?t[0]:void 0),named:i!==d,sides:[...new Set(i!==d?[s.position]:w.map(f=>c?.[f]?.position).filter(Boolean))]}]})}function g(n,e){return n===e?{}:{target:n}}function O(n,e,a={},{create:i=!1,whole:s=!1}={}){const c=x(n),d=c.filter(r=>r.channel===e);let t;if(Object.hasOwn(a,"target")){const r=a.target;if(t=c.find(l=>l.id===r),t===void 0||t.channel!==e)throw new Error(`Unknown ${e}-axis target "${r}".`)}else if(t=d.find(r=>r.id===e),t===void 0){if(d.length>1)throw new Error(`Multiple ${e}-axes require an explicit target.`);t=d[0]}const{target:f,...o}=a,u=t?.id??e;if(!t?.named&&o.position!==void 0&&c.some(r=>r.named)){const r=[...new Set((n.semanticSpec.layers??[]).filter(l=>l.encoding?.[e]?.scale===(o.scale??t?.scale??e)).map(l=>l.coordinate).filter(Boolean))];m(n,{id:u,channel:e,coordinate:t?.coordinate??(r.length===1?r[0]:void 0),position:o.position})}if(t?.named){if(o.scale!==void 0&&o.scale!==t.scale||o.coordinate!==void 0&&o.coordinate!==t.coordinate)throw new Error(`Axis "${u}" resource binding does not match the requested filter.`);if(!s&&o.position!==void 0&&o.position!==t.semantic.position)throw new Error(`Named axis "${u}" components share one side; edit the complete axis position.`);i&&(o.scale??=t.scale),s||(o.position??=t.semantic.position)}return{id:u,owner:t,options:o}}function m(n,{id:e,channel:a,coordinate:i,position:s}){for(const c of x(n))if(c.id!==e&&c.coordinate===i&&c.sides.includes(s))throw new Error(`Axis side "${s}" is already occupied on coordinate "${i}".`)}function b(n,e=n){const a=["Line","Ticks","Labels","Title"];if(e!==n)return a.map(s=>`axis_${e}__${s}`);const i=n==="radius"?"radial":n;return a.map(s=>`${i}Axis${s}`)}export{m as assertCartesianAxisSideAvailable,b as axisGraphicIds,g as axisTargetArgs,x as cartesianAxisOwners,O as selectCartesianAxis};

package/src/selectors/graphicCapacity.js

@@ -0,0 +1,38 @@
+import { annotateError } from "../core/diagnostics.js";
+import { findLayer } from "./layers.js";
+import { findDataset } from "./datasets.js";
+
+export function namespaceGraphicId(namespace, id) {
+  const encode = value => Array.from(value, character =>
+    character.codePointAt(0).toString(16).padStart(6, "0")
+  ).join("");
+  return `g${encode(namespace)}_${id}`;
+}
+
+function pointOwners(program, id) {
+  const layer = findLayer(program, id);
+  const dataset = layer?.mark?.type === "point" ? findDataset(program, layer.data) : undefined;
+  const owners = Array.isArray(dataset?.values) ? [{ layer, dataset }] : [];
+  for (const childId of program.compositionSpec?.children ?? []) {
+    const prefix = namespaceGraphicId(`${program.compositionSpec.id}-${childId}`, "");
+    const child = program.children[childId];
+    if (!id.startsWith(prefix) || child === undefined) continue;
+    const localId = id.slice(prefix.length);
+    if (child.graphicSpec.objects[localId] === undefined) continue;
+    owners.push(...pointOwners(child, localId));
+  }
+  return owners;
+}
+
+export function resolveGraphicItemCapacity(program, { id, label, type }) {
+  const owners = pointOwners(program, id);
+  if (owners.length > 1) throw annotateError(new Error("Point graphic ownership is ambiguous."), {
+    code: "ambiguous-resource", resourceId: id, candidates: owners.map(owner => owner.layer.id)
+  });
+  return {
+    pointOwned: owners.length === 1,
+    rawCount: owners[0]?.dataset.values.length,
+    graphicType: type ?? program.graphicSpec.objects[id]?.type,
+    label
+  };
+}

package/src/version.js

@@ -1,2 +1,2 @@
 // Must match package.json; enforced by the snapshot producer-version test.
-export const packageVersion = "0.0.18";
+export const packageVersion = "0.0.19";

package/types/basic.d.ts

@@ -4,6 +4,7 @@ export type {
   AxisLabelOptions,
   AxisLineStyleOptions,
   AxisTickOptions,
+  CartesianGuideDashMap,
   AxisTicksAndLabelsOptions,
   AxisTitleOptions,
   DisplayLabelMap,
@@ -15,6 +16,7 @@ export type {
   CanvasOptions,
   ColorEncodingOptions,
   CompleteAxisOptions,
+  NamedCompleteAxis,
   CreateAxesOptions,
   CreateBarPlotOptions,
   BarRangePositionChannel,

package/types/index.d.ts

@@ -21,6 +21,7 @@ export type {
   AxisLabelStyleOptions,
   AxisLineStyleOptions,
   AxisTickOptions,
+  CartesianGuideDashMap,
   AxisTicksAndLabelsOptions,
   AxisTickStyleOptions,
   AxisTitleOptions,
@@ -65,6 +66,7 @@ export type {
   ShapeEncodingOptions,
   AngleEncodingOptions,
   CompleteAxisOptions,
+  NamedCompleteAxis,
   ConcatCompositionSpec,
   CompositionAlign,
   CompositionOptions,
@@ -219,6 +221,7 @@ export type {
   DurationWindowFrame,
   DurationWindowUnit,
   DatasetRegressionTransform,
+  DatasetRegressionStatisticsTransform,
   DatasetScalar,
   StatisticalWeight,
   DatasetStackTransform,
@@ -238,6 +241,7 @@ export type {
   EditDensityDataOptions,
   EditStackDataOptions,
   EditRegressionDataOptions,
+  EditRegressionStatisticsDataOptions,
   EditIntervalDataOptions,
   EditECDFDataOptions,
   EditNormalizedDataOptions,
@@ -357,6 +361,7 @@ export type {
   SecondaryPositionEncodingOptions,
   RegressionBandOptions,
   RegressionDataOptions,
+  RegressionStatisticsDataOptions,
   RegressionInterval,
   RegressionMethod,
   RegressionOptions,