Action that generates SVG charts from data using D3. Supports bar, line, pie, scatter, and area charts.

This action is designed for AI agents and workflows to create publication-quality visualizations from structured data without writing visualization code.

Example

// Simple bar chart
await runAction({
ActionName: 'Create SVG Chart',
Params: [
{ Name: 'ChartType', Value: 'bar' },
{ Name: 'Data', Value: JSON.stringify([
{ label: 'A', value: 28 },
{ label: 'B', value: 55 },
{ label: 'C', value: 43 }
]) },
{ Name: 'Title', Value: 'Sample Bar Chart' }
]
});

// Line chart with X/Y data
await runAction({
ActionName: 'Create SVG Chart',
Params: [
{ Name: 'ChartType', Value: 'line' },
{ Name: 'Data', Value: JSON.stringify([
{ x: 1, y: 10 },
{ x: 2, y: 25 },
{ x: 3, y: 15 }
]) }
]
});

// Pie chart
await runAction({
ActionName: 'Create SVG Chart',
Params: [
{ Name: 'ChartType', Value: 'pie' },
{ Name: 'Data', Value: JSON.stringify([
{ label: 'LLM', value: 67 },
{ label: 'Embeddings', value: 10 }
]) }
]
});

Hierarchy (view full)

Constructors

Methods

  • Generates an SVG chart from the provided data and configuration

    Parameters

    • params: RunActionParams<any>

      The action parameters containing:

      • ChartType: Type of chart (bar, line, pie, scatter, area)
      • Data: JSON array of data objects
      • Title: Chart title (optional)
      • XAxisLabel: X-axis label (optional)
      • YAxisLabel: Y-axis label (optional)
      • Width: Chart width in pixels (optional, default: 800)
      • Height: Chart height in pixels (optional, default: 600)
      • Palette: Color palette name (optional, default: 'mjDefault')
      • ShowGrid: Show grid lines (optional, default: false)
      • ShowLegend: Show legend (optional, default: false)

    Returns Promise<SVGActionResult>

    A promise resolving to an ActionResultSimple with:

    • Success: true if chart was generated successfully
    • ResultCode: "SUCCESS" or error code
    • Message: The SVG string or error message
  • Executes the action with the provided parameters.

    Parameters

    • params: RunActionParams<any>

      The action execution parameters including context

    Returns Promise<ActionResultSimple>

    Promise resolving to the action result

  • Adds a legend for pie charts

    Parameters

    • doc: Document
    • svg: SVGElement
    • data: ChartDataPoint[]
    • branding: Branding
    • vb: {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }
      • contentHeight: number
      • contentWidth: number
      • height: number
      • width: number
      • x: number
      • y: number
    • font: Required<FontSpec>

    Returns void

  • Draws grid lines

    Parameters

    • doc: Document
    • container: Element
    • xScale: any
    • yScale: ScaleLinear<number, number, never>
    • vb: {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }
      • contentHeight: number
      • contentWidth: number
      • height: number
      • width: number
      • x: number
      • y: number
    • palette: {
          background: string;
          categorical: string[];
          foreground: string;
          sequential: string[];
      }
      • background: string
      • categorical: string[]
      • foreground: string
      • sequential: string[]
    • direction: "horizontal" | "vertical" | "both"

    Returns void

  • Draws X-axis for categorical data

    Parameters

    • doc: Document
    • svg: SVGElement
    • xScale: ScaleBand<string>
    • vb: {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }
      • contentHeight: number
      • contentWidth: number
      • height: number
      • width: number
      • x: number
      • y: number
    • palette: {
          background: string;
          categorical: string[];
          foreground: string;
          sequential: string[];
      }
      • background: string
      • categorical: string[]
      • foreground: string
      • sequential: string[]
    • font: Required<FontSpec>
    • label: string

    Returns void

  • Draws X-axis for numeric data

    Parameters

    • doc: Document
    • svg: SVGElement
    • xScale: ScaleLinear<number, number, never>
    • vb: {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }
      • contentHeight: number
      • contentWidth: number
      • height: number
      • width: number
      • x: number
      • y: number
    • palette: {
          background: string;
          categorical: string[];
          foreground: string;
          sequential: string[];
      }
      • background: string
      • categorical: string[]
      • foreground: string
      • sequential: string[]
    • font: Required<FontSpec>
    • label: string

    Returns void

  • Draws Y-axis

    Parameters

    • doc: Document
    • svg: SVGElement
    • yScale: ScaleLinear<number, number, never>
    • vb: {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }
      • contentHeight: number
      • contentWidth: number
      • height: number
      • width: number
      • x: number
      • y: number
    • palette: {
          background: string;
          categorical: string[];
          foreground: string;
          sequential: string[];
      }
      • background: string
      • categorical: string[]
      • foreground: string
      • sequential: string[]
    • font: Required<FontSpec>
    • label: string

    Returns void