Member Junction
    Preparing search index...

    Class SVGUtils

    Utility class for SVG operations

    Index

    Constructors

    constructor

    Methods

    addA11y addArrowMarker addStyles addTooltipSupport calculateViewBox createSVG estimateTextWidth generateId generatePanZoomScript getOrCreateDefs roundedRectPath sanitizeSVG sanitizeText seededRandom wrapText wrapWithScrollContainer

    Constructors

    Methods

    • Generates interactive tooltip script for SVG elements Elements must have data-tooltip attribute

      Parameters

      • svg: SVGElement

        SVG element to add tooltip to

      • doc: Document

        Document to create elements in

      Returns void

      Script tag with tooltip implementation

    • Calculates viewBox with padding applied

      Parameters

      • viewBox: ViewBox

        ViewBox configuration

      Returns {
          contentHeight: number;
          contentWidth: number;
          height: number;
          width: number;
          x: number;
          y: number;
      }

      Padding-adjusted dimensions and offsets

    • Creates a base SVG element with proper namespace and dimensions

      Parameters

      • width: number

        SVG width in pixels

      • height: number

        SVG height in pixels

      • OptionalidPrefix: string

        Optional ID prefix for the root SVG element

      Returns Document

      JSDOM Document containing the SVG

    • Calculates text width (approximate based on character count and font size) More accurate measurement would require actual rendering

      Parameters

      • text: string

        Text content

      • fontSize: number = 14

        Font size in pixels

      Returns number

      Estimated width in pixels

    • Generates self-contained pan/zoom script for SVG No external dependencies - fully embedded JavaScript

      Parameters

      • containerId: string = 'pan-zoom-container'

        ID of the SVG group to apply transform to

      • minScale: number = 0.5

        Minimum zoom level (default: 0.5)

      • maxScale: number = 3

        Maximum zoom level (default: 3)

      • showControls: boolean = false

        Show zoom in/out/reset buttons (default: false)

      Returns string

      Script tag with pan/zoom implementation

    • Creates a rounded rectangle path

      Parameters

      • x: number

        X coordinate

      • y: number

        Y coordinate

      • width: number

        Width

      • height: number

        Height

      • radius: number

        Corner radius

      Returns string

      SVG path data string

    • Sanitizes SVG string to remove potentially malicious content

      • Removes event handlers (on*)
      • Removes external image references
      • Removes external use references
      • Restricts href to # and mailto: only

      Parameters

      • svgString: string

        Raw SVG XML string

      Returns string

      Sanitized SVG string

    • Creates a seeded pseudo-random number generator Uses simple Linear Congruential Generator for deterministic output

      Parameters

      • seed: number

        Random seed

      Returns () => number

      Function that returns random numbers between 0 and 1

    • Wraps SVG string in a scrollable HTML container Useful for large visualizations that exceed viewport size

      Parameters

      • svgString: string

        The SVG XML string to wrap

      • maxWidth: number = 1200

        Maximum container width in pixels (default: 1200)

      • maxHeight: number = 800

        Maximum container height in pixels (default: 800)

      • showBorder: boolean = true

        Whether to show container border (default: true)

      • borderColor: string = '#ddd'

        Border color (default: #ddd)

      Returns string

      HTML string with SVG wrapped in scrollable div

    Settings

    Member Visibility

    On This Page

    Constructors
    Methods