Javascript reference
Modules¶
- PlotParser
Plot parser implementation.
- PlotParserInit
Initialization for the plot parser.
Functions¶
- getNodeAnchorPoints(parser, node) ⇒
Array.<object> Get SVG-space anchor points for nearest-hover hit testing on a node.
- getPathSamplePoints(parser, node) ⇒
Array.<object> Sample an SVG path into SVG-space points.
- getBBoxAnchorPoints(parser, node, include_corners) ⇒
Array.<object> Get center and optional edge anchor points from a node bounding box.
- getNodeBBox(parser, node) ⇒
object|null Get a finite bounding box for an SVG node.
- getAttributeBBox(node) ⇒
object|null Build a bounding box from SVG position and size attributes.
- numberAttribute(node, name) ⇒
number Read a numeric SVG attribute.
- getPanelBounds(parser, axes_class) ⇒
object|null Get the interactive panel bounds for an axes group.
- getAxesClipBounds(parser, axes_class) ⇒
object|null Get bounds from the clip path attached to an axes group.
- getClipPathId(clip_path) ⇒
string|null Extract the id referenced by an SVG clip-path value.
- eventToSvgPoint(parser, event) ⇒
object|null Convert a pointer event position to SVG coordinates.
- clientPointToSvg(parser, client_x, client_y) ⇒
object Convert viewport client coordinates to SVG coordinates.
- clientPointToSvgFromViewBox(parser, client_x, client_y) ⇒
object Convert client coordinates to SVG coordinates using the SVG viewBox.
- getSvgViewBox(svg_node, rect) ⇒
object|null Resolve an SVG viewBox from baseVal, attributes, or rendered bounds.
- nodePointToSvg(parser, node, x, y) ⇒
object Convert a node-local point to SVG root coordinates.
- isFinitePoint(point) ⇒
boolean Check whether a point has finite x and y coordinates.
- isFiniteBBox(bbox) ⇒
boolean Check whether a bounding box has finite position and size values.
- pointInBounds(point, bounds) ⇒
boolean Check whether a point lies within rectangular bounds.
- setTooltipContent(parser, label)
Set sanitized tooltip content.
- hasClickHandler(click_handler) ⇒
boolean Check whether a click handler reference is present.
- getClickHandler(click_handler) ⇒
function|null Resolve a click handler function from a function value or registered id.
- repeatExact(values, length) ⇒
Array Repeat values only when they evenly fill the requested length.
- normalizeHoverConfig(hover_config, node_count) ⇒
object Normalize hover configuration arrays and node lookup maps in place.
- normalizeHoverConfigs(hover_configs) ⇒
Array.<object> Normalize a list of hover configurations.
- buildNodesByValue(nodes, values) ⇒
Map.<*, Array.<SVGElement>> Build a map from hover field values to matching SVG nodes.
- getHoverMatch(record) ⇒
object Get the hover field and value used to match linked elements.
- clearHoverEffects(hover_configs)
Clear hover classes for a hover scope.
- positionTooltip(parser, event, show_tooltip)
Move and show or hide the tooltip for a pointer event.
- applyHoverRecord(parser, record, event, hover_configs)
Apply hover classes and tooltip content for one hover record.
- getScopeState(hover_configs) ⇒
object Get persistent hover state for a hover configuration scope.
- setNodesClass(nodes, className, value)
Toggle a CSS class on a list of nodes.
- setHoverEffect(parser, plot_element, tooltip_labels, tooltip_groups, show_tooltip, reverse_hover, click_handlers, hover_keys, hover_configs)
Attach direct hover behavior to plot elements.
- setClickEffect(parser, plot_element, click_handlers)
Attach click behavior to plot elements.
- setNearestHoverEffect(parser, svg, axes_class, hover_configs, hover_scope_configs)
Attach nearest-point hover behavior for one axes group.
- updateNearestHover(parser, event, state)
Update the active nearest-hover record for a pointer event.
- getHoverScope(record, state) ⇒
Array.<object> Choose the hover scope for a nearest-hover record.
- ensureNearestHoverPanel(axes_node, panel_bounds)
Ensure an invisible panel exists to receive nearest-hover pointer events.
- clearActiveNearestHover(parser, state)
Clear the active nearest-hover record and tooltip.
- getHoverRecords(hover_configs) ⇒
Array.<object> Build hover records from normalized hover configurations.
- getNearestAnchors(parser, records, bounds) ⇒
Array.<object> Build nearest-hover anchor points for hover records.
- getDirectHoverRecord(event, state) ⇒
object|null Resolve a directly targeted plot element to its hover record.
- closestPlotElement(node, axes_node) ⇒
Element|null Find the nearest ancestor plot element within an axes group.
- setZoomEffect(svg, options) ⇒
object|null Attach visual zoom and pan behavior to the rendered SVG chart.
PlotParser¶
Plot parser implementation.
- PlotParser
- module.exports ⏏
- new module.exports(svg, tooltip, sanitizer, nearest_sample_spacing, nearest_max_samples)
- .findBars(svg, axes_class, tooltip_groups) ⇒
d3.Selection - .findBoxes(svg, axes_class, tooltip_groups) ⇒
d3.Selection - .findPoints(svg, axes_class, tooltip_groups) ⇒
d3.Selection - .findLines(svg, axes_class) ⇒
d3.Selection - .findAreas(svg, axes_class) ⇒
d3.Selection - .findPolygons(svg, axes_class) ⇒
d3.Selection - .getSvgSummary(svg, axes_config) ⇒
string - .getAxesSummary(axes_class, plot_elements) ⇒
object - .logParseSummary(svg_summary, axes_summaries)
- ._selectionSize(selection) ⇒
number - ._formatCount(count, noun) ⇒
string - ._formatIds(ids) ⇒
string
- module.exports ⏏
module.exports ⏏¶
Parses a Matplotlib-generated SVG and labels plot elements for ninejs interactions.
new module.exports(svg, tooltip, sanitizer, nearest_sample_spacing, nearest_max_samples)¶
Create a parser for one SVG plot.
| Param | Type | Default | Description |
|---|---|---|---|
| svg | d3.Selection |
SVG root selection. | |
| tooltip | d3.Selection |
Tooltip container selection. | |
| sanitizer | object |
Optional DOMPurify-compatible sanitizer. | |
| nearest_sample_spacing | number |
12 |
Pixel spacing for nearest-hover sampling. |
| nearest_max_samples | number |
48 |
Maximum samples used for path hit-testing. |
module.exports.findBars(svg, axes_class, tooltip_groups) ⇒ d3.Selection¶
Find bar paths in an axes group and assign tooltip group identifiers.
Kind: instance method of module.exports
Returns: d3.Selection - Bar element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
| tooltip_groups | Array.<string> |
Tooltip group id per bar. |
module.exports.findBoxes(svg, axes_class, tooltip_groups) ⇒ d3.Selection¶
Find boxplot glyphs in an axes group and assign tooltip group identifiers.
Kind: instance method of module.exports
Returns: d3.Selection - Box element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
| tooltip_groups | Array.<string> |
Tooltip group id per box. |
module.exports.findPoints(svg, axes_class, tooltip_groups) ⇒ d3.Selection¶
Find point markers in an axes group and assign tooltip group identifiers.
Kind: instance method of module.exports
Returns: d3.Selection - Point element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
| tooltip_groups | Array.<string> |
Tooltip group id per point. |
module.exports.findLines(svg, axes_class) ⇒ d3.Selection¶
Find line paths in an axes group while excluding axis decoration lines.
Kind: instance method of module.exports
Returns: d3.Selection - Line element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
module.exports.findAreas(svg, axes_class) ⇒ d3.Selection¶
Find area fill paths in an axes group.
Kind: instance method of module.exports
Returns: d3.Selection - Area element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
module.exports.findPolygons(svg, axes_class) ⇒ d3.Selection¶
Find polygon paths in an axes group.
Kind: instance method of module.exports
Returns: d3.Selection - Polygon element selection.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
module.exports.getSvgSummary(svg, axes_config) ⇒ string¶
Build a short parse summary for all axes groups in the SVG.
Kind: instance method of module.exports
Returns: string - Human-readable SVG summary.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| axes_config | object |
Parser configuration keyed by axes id. |
module.exports.getAxesSummary(axes_class, plot_elements) ⇒ object¶
Summarize detected plot elements for one axes group.
Kind: instance method of module.exports
Returns: object - Axes summary object.
| Param | Type | Description |
|---|---|---|
| axes_class | string |
Matplotlib axes group id. |
| plot_elements | object |
Element selections keyed by geom type. |
module.exports.logParseSummary(svg_summary, axes_summaries)¶
Log the SVG and axes parse summaries to the browser console.
Kind: instance method of module.exports
| Param | Type | Description |
|---|---|---|
| svg_summary | string |
Human-readable SVG summary. |
| axes_summaries | Array.<object> |
Per-axes summary objects. |
module.exports._selectionSize(selection) ⇒ number¶
Count the elements in a D3 selection.
Kind: instance method of module.exports
Returns: number - Number of selected elements.
| Param | Type | Description |
|---|---|---|
| selection | d3.Selection |
Selection to count. |
module.exports._formatCount(count, noun) ⇒ string¶
Format a count and noun with simple pluralization.
Kind: instance method of module.exports
Returns: string - Formatted count.
| Param | Type | Description |
|---|---|---|
| count | number |
Count to format. |
| noun | string |
Singular noun. |
module.exports._formatIds(ids) ⇒ string¶
Format a list of SVG ids for log output.
Kind: instance method of module.exports
Returns: string - Parenthesized ids or a none marker.
| Param | Type | Description |
|---|---|---|
| ids | Array.<string> |
SVG ids to format. |
PlotParserInit¶
Initialization for the plot parser.
module.exports() ⏏¶
Initialize ninejs interactions for the embedded plot.
getNodeAnchorPoints(parser, node) ⇒ Array.<object>¶
Get SVG-space anchor points for nearest-hover hit testing on a node.
Kind: global function
Returns: Array.<object> - Anchor points in SVG coordinates.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| node | SVGElement |
Plot element node. |
getPathSamplePoints(parser, node) ⇒ Array.<object>¶
Sample an SVG path into SVG-space points.
Kind: global function
Returns: Array.<object> - Sampled points in SVG coordinates.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| node | SVGElement |
Path-like SVG node. |
getBBoxAnchorPoints(parser, node, include_corners) ⇒ Array.<object>¶
Get center and optional edge anchor points from a node bounding box.
Kind: global function
Returns: Array.<object> - Anchor points in SVG coordinates.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| node | SVGElement |
SVG node to inspect. |
| include_corners | boolean |
Whether to include corners and edge midpoints. |
getNodeBBox(parser, node) ⇒ object | null¶
Get a finite bounding box for an SVG node.
Kind: global function
Returns: object | null - Bounding box or null when unavailable.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| node | SVGElement |
SVG node to inspect. |
getAttributeBBox(node) ⇒ object | null¶
Build a bounding box from SVG position and size attributes.
Kind: global function
Returns: object | null - Bounding box or null when attributes are incomplete.
| Param | Type | Description |
|---|---|---|
| node | SVGElement |
SVG node to inspect. |
numberAttribute(node, name) ⇒ number¶
Read a numeric SVG attribute.
Kind: global function
Returns: number - Numeric value, or NaN when missing or invalid.
| Param | Type | Description |
|---|---|---|
| node | SVGElement |
SVG node to inspect. |
| name | string |
Attribute name. |
getPanelBounds(parser, axes_class) ⇒ object | null¶
Get the interactive panel bounds for an axes group.
Kind: global function
Returns: object | null - Panel bounds or null when unavailable.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| axes_class | string |
Matplotlib axes group id. |
getAxesClipBounds(parser, axes_class) ⇒ object | null¶
Get bounds from the clip path attached to an axes group.
Kind: global function
Returns: object | null - Clip bounds or null when unavailable.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| axes_class | string |
Matplotlib axes group id. |
getClipPathId(clip_path) ⇒ string | null¶
Extract the id referenced by an SVG clip-path value.
Kind: global function
Returns: string | null - Clip path id or null when absent.
| Param | Type | Description |
|---|---|---|
| clip_path | string | null |
SVG clip-path attribute value. |
eventToSvgPoint(parser, event) ⇒ object | null¶
Convert a pointer event position to SVG coordinates.
Kind: global function
Returns: object | null - SVG point or null when coordinates are invalid.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| event | Event |
Pointer or mouse event. |
clientPointToSvg(parser, client_x, client_y) ⇒ object¶
Convert viewport client coordinates to SVG coordinates.
Kind: global function
Returns: object - SVG point.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| client_x | number |
Client x coordinate. |
| client_y | number |
Client y coordinate. |
clientPointToSvgFromViewBox(parser, client_x, client_y) ⇒ object¶
Convert client coordinates to SVG coordinates using the SVG viewBox.
Kind: global function
Returns: object - SVG point.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| client_x | number |
Client x coordinate. |
| client_y | number |
Client y coordinate. |
getSvgViewBox(svg_node, rect) ⇒ object | null¶
Resolve an SVG viewBox from baseVal, attributes, or rendered bounds.
Kind: global function
Returns: object | null - ViewBox-like bounds or null when unavailable.
| Param | Type | Description |
|---|---|---|
| svg_node | SVGSVGElement |
SVG root node. |
| rect | DOMRect |
Rendered SVG bounds. |
nodePointToSvg(parser, node, x, y) ⇒ object¶
Convert a node-local point to SVG root coordinates.
Kind: global function
Returns: object - SVG point.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| node | SVGElement |
SVG node containing the point. |
| x | number |
Node-local x coordinate. |
| y | number |
Node-local y coordinate. |
isFinitePoint(point) ⇒ boolean¶
Check whether a point has finite x and y coordinates.
Kind: global function
Returns: boolean - Whether the point is finite.
| Param | Type | Description |
|---|---|---|
| point | object | null |
Point to inspect. |
isFiniteBBox(bbox) ⇒ boolean¶
Check whether a bounding box has finite position and size values.
Kind: global function
Returns: boolean - Whether the bounding box is finite.
| Param | Type | Description |
|---|---|---|
| bbox | object | null |
Bounding box to inspect. |
pointInBounds(point, bounds) ⇒ boolean¶
Check whether a point lies within rectangular bounds.
Kind: global function
Returns: boolean - Whether the point is inside the bounds.
| Param | Type | Description |
|---|---|---|
| point | object |
Point to inspect. |
| bounds | object |
Rectangular bounds. |
setTooltipContent(parser, label)¶
Set sanitized tooltip content.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| label | * |
Tooltip label value. |
hasClickHandler(click_handler) ⇒ boolean¶
Check whether a click handler reference is present.
Kind: global function
Returns: boolean - Whether the value can reference a click handler.
| Param | Type | Description |
|---|---|---|
| click_handler | * |
Handler function or registered handler id. |
getClickHandler(click_handler) ⇒ function | null¶
Resolve a click handler function from a function value or registered id.
Kind: global function
Returns: function | null - Click handler function or null.
| Param | Type | Description |
|---|---|---|
| click_handler | * |
Handler function or registered handler id. |
repeatExact(values, length) ⇒ Array¶
Repeat values only when they evenly fill the requested length.
Kind: global function
Returns: Array - Original or repeated values.
| Param | Type | Description |
|---|---|---|
| values | Array |
Values to repeat. |
| length | number |
Target length. |
normalizeHoverConfig(hover_config, node_count) ⇒ object¶
Normalize hover configuration arrays and node lookup maps in place.
Kind: global function
Returns: object - Normalized hover configuration.
| Param | Type | Description |
|---|---|---|
| hover_config | object |
Hover configuration object. |
| node_count | number |
Number of plot element nodes. |
normalizeHoverConfigs(hover_configs) ⇒ Array.<object>¶
Normalize a list of hover configurations.
Kind: global function
Returns: Array.<object> - Normalized hover configurations.
| Param | Type | Description |
|---|---|---|
| hover_configs | Array.<object> |
Hover configurations to normalize. |
buildNodesByValue(nodes, values) ⇒ Map.<*, Array.<SVGElement>>¶
Build a map from hover field values to matching SVG nodes.
Kind: global function
Returns: Map.<*, Array.<SVGElement>> - Nodes grouped by field value.
| Param | Type | Description |
|---|---|---|
| nodes | Array.<(SVGElement|null)> |
Plot element nodes. |
| values | Array |
Field values aligned with nodes. |
getHoverMatch(record) ⇒ object¶
Get the hover field and value used to match linked elements.
Kind: global function
Returns: object - Match field and value.
| Param | Type | Description |
|---|---|---|
| record | object |
Hover record. |
clearHoverEffects(hover_configs)¶
Clear hover classes for a hover scope.
Kind: global function
| Param | Type | Description |
|---|---|---|
| hover_configs | Array.<object> |
Hover configurations in the scope. |
positionTooltip(parser, event, show_tooltip)¶
Move and show or hide the tooltip for a pointer event.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| event | Event |
Pointer or mouse event. |
| show_tooltip | string |
CSS display value for the tooltip. |
applyHoverRecord(parser, record, event, hover_configs)¶
Apply hover classes and tooltip content for one hover record.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| record | object |
Hover record containing config and node index. |
| event | Event |
Pointer or mouse event. |
| hover_configs | Array.<object> |
Hover configurations in scope. |
getScopeState(hover_configs) ⇒ object¶
Get persistent hover state for a hover configuration scope.
Kind: global function
Returns: object - Mutable hover state.
| Param | Type | Description |
|---|---|---|
| hover_configs | Array.<object> |
Hover configurations in the scope. |
setNodesClass(nodes, className, value)¶
Toggle a CSS class on a list of nodes.
Kind: global function
| Param | Type | Description |
|---|---|---|
| nodes | Array.<SVGElement> |
Nodes to update. |
| className | string |
Class name to toggle. |
| value | boolean |
Whether the class should be present. |
setHoverEffect(parser, plot_element, tooltip_labels, tooltip_groups, show_tooltip, reverse_hover, click_handlers, hover_keys, hover_configs)¶
Attach direct hover behavior to plot elements.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| plot_element | d3.Selection |
Plot element selection. |
| tooltip_labels | Array |
Tooltip labels aligned with nodes. |
| tooltip_groups | Array |
Tooltip groups aligned with nodes. |
| show_tooltip | string |
CSS display value for the tooltip. |
| reverse_hover | boolean |
Whether to invert hover highlighting. |
| click_handlers | Array |
Click handler ids aligned with nodes. |
| hover_keys | Array |
Linked-hover keys aligned with nodes. |
| hover_configs | Array.<object> | null |
Optional hover scope configs. |
setClickEffect(parser, plot_element, click_handlers)¶
Attach click behavior to plot elements.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| plot_element | d3.Selection |
Plot element selection. |
| click_handlers | Array |
Click handler ids aligned with nodes. |
setNearestHoverEffect(parser, svg, axes_class, hover_configs, hover_scope_configs)¶
Attach nearest-point hover behavior for one axes group.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| svg | d3.Selection |
SVG root selection. |
| axes_class | string |
Matplotlib axes group id. |
| hover_configs | Array.<object> |
Hover configurations for this axes. |
| hover_scope_configs | Array.<object> | null |
Optional linked-hover scope. |
updateNearestHover(parser, event, state)¶
Update the active nearest-hover record for a pointer event.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| event | Event |
Pointer or mouse event. |
| state | object |
Nearest-hover state. |
getHoverScope(record, state) ⇒ Array.<object>¶
Choose the hover scope for a nearest-hover record.
Kind: global function
Returns: Array.<object> - Hover configurations in scope.
| Param | Type | Description |
|---|---|---|
| record | object |
Hover record. |
| state | object |
Nearest-hover state. |
ensureNearestHoverPanel(axes_node, panel_bounds)¶
Ensure an invisible panel exists to receive nearest-hover pointer events.
Kind: global function
| Param | Type | Description |
|---|---|---|
| axes_node | SVGGElement |
Axes group node. |
| panel_bounds | object |
Panel bounds. |
clearActiveNearestHover(parser, state)¶
Clear the active nearest-hover record and tooltip.
Kind: global function
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| state | object |
Nearest-hover state. |
getHoverRecords(hover_configs) ⇒ Array.<object>¶
Build hover records from normalized hover configurations.
Kind: global function
Returns: Array.<object> - Hover records aligned to plot nodes.
| Param | Type | Description |
|---|---|---|
| hover_configs | Array.<object> |
Hover configurations to index. |
getNearestAnchors(parser, records, bounds) ⇒ Array.<object>¶
Build nearest-hover anchor points for hover records.
Kind: global function
Returns: Array.<object> - Anchor points with attached hover records.
| Param | Type | Description |
|---|---|---|
| parser | object |
Plot parser instance. |
| records | Array.<object> |
Hover records to sample. |
| bounds | object | null |
Optional bounds filter. |
getDirectHoverRecord(event, state) ⇒ object | null¶
Resolve a directly targeted plot element to its hover record.
Kind: global function
Returns: object | null - Hover record or null.
| Param | Type | Description |
|---|---|---|
| event | Event |
Pointer or mouse event. |
| state | object |
Nearest-hover state. |
closestPlotElement(node, axes_node) ⇒ Element | null¶
Find the nearest ancestor plot element within an axes group.
Kind: global function
Returns: Element | null - Matching plot element or null.
| Param | Type | Description |
|---|---|---|
| node | Node |
Starting DOM node. |
| axes_node | SVGGElement |
Axes group node. |
setZoomEffect(svg, options) ⇒ object | null¶
Attach visual zoom and pan behavior to the rendered SVG chart.
Kind: global function
Returns: object | null - D3 zoom behavior or null when unavailable.
| Param | Type | Description |
|---|---|---|
| svg | d3.Selection |
SVG root selection. |
| options | object |
Zoom options. |