Member Junction
    Preparing search index...

    Class CreateSVGSketchDiagramAction

    Action that generates hand-drawn/sketch-style SVG diagrams using Rough.js. Provides informal, whiteboard-style visualizations for brainstorming and presentations.

    This action supports the same diagram types as Create SVG Diagram but renders them with a sketchy, hand-drawn aesthetic using Rough.js.

    // Sketch flowchart
    await runAction({
      ActionName: 'Create SVG Sketch Diagram',
      Params: [
        { Name: 'DiagramType', Value: 'flow' },
        { Name: 'Nodes', Value: JSON.stringify([
          { id: '1', kind: 'start', label: 'Start' },
          { id: '2', kind: 'process', label: 'Process' },
          { id: '3', kind: 'end', label: 'End' }
        ]) },
        { Name: 'Edges', Value: JSON.stringify([
          { from: '1', to: '2' },
          { from: '2', to: '3' }
        ]) },
        { Name: 'Roughness', Value: '1.5' },
        { Name: 'FillStyle', Value: 'cross-hatch' }
      ]
    });

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Methods

    InternalRunAction Run

    Constructors

    Methods

    • Generates a hand-drawn style SVG diagram from the provided data and configuration

      Parameters

      • params: RunActionParams

        The action parameters containing:

        • DiagramType: Type of diagram ('flow' | 'org' | 'er')
        • Nodes: JSON array or object of nodes
        • Edges: JSON array of edges (for flow and ER diagrams)
        • Roughness: Hand-drawn wobble intensity (0.5-3.0, default: 1.5)
        • FillStyle: Fill pattern ('solid' | 'hachure' | 'cross-hatch' | 'dots', default: 'hachure')
        • Bowing: Curve intensity for lines (0-5, default: 1)
        • Direction: Layout direction ('TB' | 'LR' | 'RL' | 'BT') for flow diagrams
        • Width: Diagram width in pixels (optional, default: 800)
        • Height: Diagram height in pixels (optional, default: 600)
        • Title: Diagram title (optional)
        • Palette: Color palette name (optional)
        • EnableTooltips: Enable interactive tooltips (optional)
        • EnablePanZoom: Enable pan and zoom (optional)
        • WrapWithContainer: Wrap in scrollable container (optional)

      Returns Promise<SVGActionResult>

      A promise resolving to an SVGActionResult

    Settings

    Member Visibility

    On This Page

    Constructors
    Methods