Skip to content
D
Documentation

Canvas — types

reference
1 min readUpdated

Types

Import these from @grafloria/renderer.

Types

BackendMode

Also has every member of String, listed on its own entry.

ts
type BackendMode = 'svg' | 'canvas';

CanvasHazard

Also has every member of String, listed on its own entry.

Why canvas mode would take something away from this particular diagram, right now.

ts
type CanvasHazard =

  | 'a11y-active'

  | 'focus-inside'

  | 'foreign-object';

DrawCall

One recorded paint operation, with the state that produced it.

ts
type DrawCall =
  | {
      op: 'fill';
      path: PathCmd[];
      fillStyle: unknown;
      globalAlpha: number;
      transform: Matrix;
      filter?: string;
    }
  | {
      op: 'stroke';
      path: PathCmd[];
      strokeStyle: unknown;
      lineWidth: number;
      lineDash: number[];
      globalAlpha: number;
      transform: Matrix;
      filter?: string;
    }
  | { op: 'clip'; path: PathCmd[]; transform: Matrix }
  | {
      op: 'fillText';
      text: string;
      x: number;
      y: number;
      font: string;
      fillStyle: unknown;
      textAlign: CanvasTextAlign;
      textBaseline: CanvasTextBaseline;
      globalAlpha: number;
      transform: Matrix;
    }
  | { op: 'clearRect'; x: number; y: number; w: number; h: number; transform: Matrix }
  | {
      op: 'fillRect';
      x: number;
      y: number;
      w: number;
      h: number;
      fillStyle: unknown;
      transform: Matrix;
    }
  | { op: 'save' }
  | { op: 'restore' }
  | { op: 'setTransform'; transform: Matrix };

Properties

NameTypeDefaultDescription
op'fill'

HitKind

Also has every member of String, listed on its own entry.

What a hit region belongs to.

ts
type HitKind = 'node' | 'link' | 'port' | 'other';

PathCmd

ts
type PathCmd =
  | { op: 'M'; x: number; y: number }
  | { op: 'L'; x: number; y: number }
  | { op: 'C'; x1: number; y1: number; x2: number; y2: number; x: number; y: number }
  | { op: 'Q'; x1: number; y1: number; x: number; y: number }
  | { op: 'Z' };

Properties

NameTypeDefaultDescription
op'M'

Was this page helpful?

Canvas — types — Grafloria