Interface: CaptionObject

Highcharts. CaptionObject

The chart caption. The caption has an update method that allows modifying the options directly or indirectly via chart.update.

Extends

Members

element :Highcharts.SVGDOMElement|Highcharts.HTMLDOMElement

The primary DOM node. Each SVGElement instance wraps a main DOM node, but may also represent more nodes.

Type:
Inherited From:

renderer :Highcharts.SVGRenderer

The renderer that the SVGElement belongs to.

Type:
Inherited From:

Methods

add( [parent])

Add the element to the DOM. All elements must be added this way.

Parameters:
Name Type Argument Description
parent Highcharts.SVGElement <optional>

The parent item to add it to. If undefined, the element is added to the Highcharts.SVGRenderer.box.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

Try it

addClass(className [, replace])

Add a class name to an element.

Parameters:
Name Type Argument Default Description
className string

The new class name to add.
replace boolean <optional>
 false

When true, the existing class name(s) will be overwritten with the new one. When false, the new one is added.
Inherited From:
Returns:
Highcharts.SVGElement .

Return the SVG element for chainability.

align( [alignOptions] [, alignByTranslate] [, alignTo] [, redraw])

Align the element relative to the chart or another box.

Parameters:
Name Type Argument Description
alignOptions Highcharts.AlignObject <optional>

The alignment options. The function can be called without this parameter in order to re-align an element after the box has been updated.
alignByTranslate boolean <optional>

Align element by translation.
alignTo string | Highcharts.BBoxObject <optional>

The box to align to, needs a width and height. When the box is a string, it refers to an object in the Renderer. For example, when box is spacingBox, it refers to Renderer.spacingBox which holds width, height, x and y properties.
redraw boolean <optional>

Decide if SVGElement should be redrawn with new alignment or just change its attributes.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

animate(params [, options] [, complete])

Animate to given attributes or CSS properties.

Parameters:
Name Type Argument Description
params Highcharts.SVGAttributes

SVG attributes or CSS to animate.
options boolean | Partial.<Highcharts.AnimationOptionsObject> <optional>

Animation options.
complete function <optional>

Function to perform at the end of animation.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

Try it

attr(key)

Parameters:
Name Type Description
key string
Inherited From:
Overrides:
Returns:

clip( [clipElem])

Apply a clipping shape to this element.

Parameters:
Name Type Argument Description
clipElem Highcharts.SVGElement <optional>

The clipping shape. If skipped, the current clip is removed.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVG element to allow chaining.

crisp(rect [, strokeWidth])

Calculate the coordinates needed for drawing a rectangle crisply and return the calculated attributes.

Parameters:
Name Type Argument Description
rect Highcharts.RectangleObject

Rectangle to crisp.
strokeWidth number <optional>

The stroke width to consider when computing crisp positioning. It can also be set directly on the rect parameter.
Inherited From:
Returns:
Highcharts.RectangleObject .

The modified rectangle arguments.

css(styles)

Set styles for the element. In addition to CSS styles supported by native SVG and HTML elements, there are also some custom made for Highcharts, like width, ellipsis and textOverflow for SVG text elements.

Parameters:
Name Type Description
styles Highcharts.CSSObject

The new CSS styles.
Inherited From:
Returns:
Highcharts.SVGElement .

Return the SVG element for chaining.

Try it

destroy()

Destroy the element and element wrapper and clear up the DOM and event hooks.

Inherited From:

fadeIn( [animation])

A general fadeIn method.

Parameters:
Name Type Argument Description
animation boolean | Partial.<Highcharts.AnimationOptionsObject> <optional>

The animation options for the element fade.
Inherited From:
Requires:
  • module:modules/drilldown

getBBox( [reload] [, rot])

Get the bounding box (width, height, x and y) for the element. Generally used to get rendered text size. Since this is called a lot in charts, the results are cached based on text properties, in order to save DOM traffic. The returned bounding box includes the rotation, so for example a single text line of rotation 90 will report a greater height, and a width corresponding to the line-height.

Parameters:
Name Type Argument Description
reload boolean <optional>

Skip the cache and get the updated DOM bounding box.
rot number <optional>

Override the element's rotation. This is internally used on axis labels with a value of 0 to find out what the bounding box would be have been if it were not rotated.
Inherited From:
Returns:
Highcharts.BBoxObject .

The bounding box with x, y, width and height properties.

Try it

getStyle(prop)

Get the computed style. Only in styled mode.

Parameters:
Name Type Description
prop string

The property name to check for.
Inherited From:
Returns:
string .

The current computed value.

Example
chart.series[0].points[0].graphic.getStyle('stroke-width'); // => '1px'

hasClass(className)

Check if an element has the given class name.

Parameters:
Name Type Description
className string

The class name to check for.
Inherited From:
Returns:
boolean .

Whether the class name is found.

hide()

Hide the element, similar to setting the visibility attribute to hidden.

Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

init(renderer, nodeName)

Initialize the SVG element. This function only exists to make the initialization process overridable. It should not be called directly.

Parameters:
Name Type Description
renderer Highcharts.SVGRenderer

The SVGRenderer instance to initialize to.
nodeName string

The SVG node name.
Inherited From:

on(eventType, handler)

Add an event listener. This is a simple setter that replaces the previous event of the same type added by this function, as opposed to the Highcharts#addEvent function.

Parameters:
Name Type Description
eventType string

The event type.
handler function

The handler callback.
Inherited From:
Returns:
Highcharts.SVGElement .

The SVGElement for chaining.

Try it

removeClass(className)

Remove a class name from the element.

Parameters:
Name Type Description
className string | RegExp

The class name to remove.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVG element for chainability.

setRadialReference(coordinates)

Set the coordinates needed to draw a consistent radial gradient across a shape regardless of positioning inside the chart. Used on pie slices to make all the slices have the same radial reference point.

Parameters:
Name Type Description
coordinates Array.<number>

The center reference. The format is [centerX, centerY, diameter] in pixels.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

shadow( [shadowOptions])

Add a shadow to the element. In styled mode, this method is not used, instead use defs and filters.

Parameters:
Name Type Argument Description
shadowOptions boolean | Highcharts.ShadowOptionsObject <optional>

The shadow options. If true, the default options are applied. If false, the current shadow will be removed.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

Example
renderer.rect(10, 100, 100, 100)
    .attr({ fill: 'red' })
    .shadow(true);

show( [inherit])

Show the element after it has been hidden.

Parameters:
Name Type Argument Default Description
inherit boolean <optional>
 true

Set the visibility attribute to inherit rather than visible. The difference is that an element with visibility="visible" will be visible even if the parent is hidden.
Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

strokeWidth()

Get the computed stroke width in pixel values. This is used extensively when drawing shapes to ensure the shapes are rendered crisp and positioned correctly relative to each other. Using shape-rendering: crispEdges leaves us less control over positioning, for example when we want to stack columns next to each other, or position things pixel-perfectly within the plot box.

The common pattern when placing a shape is:

  • Create the SVGElement and add it to the DOM. In styled mode, it will now receive a stroke width from the style sheet. In classic mode we will add the stroke-width attribute.
  • Read the computed elem.strokeWidth().
  • Place it based on the stroke width.
Inherited From:
Returns:
number .

The stroke width in pixels. Even if the given stroke width (in CSS or by attributes) is based on em or other units, the pixel size is returned.

toFront()

Bring the element to the front. Alternatively, a new zIndex can be set.

Inherited From:
Returns:
Highcharts.SVGElement .

Returns the SVGElement for chaining.

Try it

translate(x, y)

Move an object and its children by x and y values.

Parameters:
Name Type Description
x number

The x value.
y number

The y value.
Inherited From:
Returns:
Highcharts.SVGElement .

Translated element.

update(captionOptions [, redraw])

Modify options for the caption.

Parameters:
Name Type Argument Default Description
captionOptions Highcharts.CaptionOptions

Options to modify.
redraw boolean <optional>
 true

Whether to redraw the chart after the caption is altered. If doing more operations on the chart, it is a good idea to set redraw to false and call Highcharts.Chart#redraw after.