Class: Point

Members

category :number|string

For categorized axes this property holds the category name for the point. For other axes it holds the X value.

Type:

• number | string

color :Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject|undefined

The point's current color.

Type:

• Highcharts.ColorString | Highcharts.GradientColorObject | Highcharts.PatternObject | undefined

colorIndex :number|undefined

The point's current color index, used in styled mode instead of color. The color index is inserted in class names used for styling.

Type:

• number | undefined

dataGroup :Highcharts.DataGroupingInfoObject|undefined

Highcharts Stock only. If a point object is created by data grouping, it doesn't reflect actual points in the raw data. In this case, the dataGroup property holds information that points back to the raw data.

• dataGroup.start is the index of the first raw data point in the group.

• dataGroup.length is the amount of points in the group.

Type:

• Highcharts.DataGroupingInfoObject | undefined

Try it

• Click to inspect raw data points.

graphic :Highcharts.SVGElement|undefined

SVG graphic representing the point in the chart. In some cases it may be a hidden graphic to improve accessibility.

Typically this is a simple shape, like a rect for column charts or path for line markers, but for some complex series types like boxplot or 3D charts, the graphic may be a g element containing other shapes. The graphic is generated the first time Highcharts.Series#drawPoints runs, and updated and moved on subsequent runs.

Type:

• Highcharts.SVGElement | undefined

See also:

• Highcharts.Point#graphics

graphics :Array.<Highcharts.SVGElement>|undefined

Array for multiple SVG graphics representing the point in the chart. Only used in cases where the point can not be represented by a single graphic.

Type:

• Array.<Highcharts.SVGElement> | undefined

See also:

• Highcharts.Point#graphic

high :number|undefined

Range series only. The high or maximum value for each data point.

Type:

• number | undefined

<readonly> index :number

Contains the point's index in the Series.points array.

Type:

• number

key :number|string

The point's name if it is defined, or its category in case of a category, otherwise the x value. Convenient for tooltip and data label formatting.

Type:

• number | string

low :number|undefined

Range series only. The low or minimum value for each data point.

Type:

• number | undefined

name :string

The name of the point. The name can be given as the first position of the point configuration array, or as a name property in the configuration:

Type:

• string

Example

// Array config
data: [
    ['John', 1],
    ['Jane', 2]
]

// Object config
data: [{
       name: 'John',
       y: 1
}, {
    name: 'Jane',
    y: 2
}]

options :Highcharts.PointOptionsObject

The point's options as applied in the initial configuration, or extended through Point.update.

In TypeScript you have to extend PointOptionsObject via an additional interface to allow custom data options:

declare interface PointOptionsObject {
    customProperty: string;
}

Type:

• Highcharts.PointOptionsObject

percentage :number|undefined

The percentage for points in a stacked series, pies or gauges.

Type:

• number | undefined

plotX :number|undefined

The translated X value for the point in terms of pixels. Relative to the X axis position if the series has one, otherwise relative to the plot area. Depending on the series type this value might not be defined.

In an inverted chart the x-axis is going from the bottom to the top so the plotX value is the number of pixels from the bottom of the axis.

Type:

• number | undefined

See also:

• Highcharts.Point#pos

plotY :number|undefined

The translated Y value for the point in terms of pixels. Relative to the Y axis position if the series has one, otherwise relative to the plot area. Depending on the series type this value might not be defined.

In an inverted chart the y-axis is going from right to left so the plotY value is the number of pixels from the right of the yAxis.

Type:

• number | undefined

See also:

• Highcharts.Point#pos

properties :*

In Highcharts Maps, when data is loaded from GeoJSON, the GeoJSON item's properies are copied over here.

Type:

• *

selected :boolean

Whether the point is selected or not.

Type:

• boolean

See also:

• Highcharts.Point#select
• Highcharts.Chart#getSelectedPoints

series :Highcharts.Series

The series object associated with the point.

Type:

• Highcharts.Series

<readonly> shapeArgs :Readonly.<Highcharts.SVGAttributes>|undefined

The attributes of the rendered SVG shape like in column or pie series.

Type:

• Readonly.<Highcharts.SVGAttributes> | undefined

total :number|undefined

The total of values in either a stack for stacked series, or a pie in a pie series.

Type:

• number | undefined

visible :boolean

For certain series types, like pie charts, where individual points can be shown or hidden.

Type:

• boolean

Default Value:

• true

x :number

The x value of the point.

Type:

• number

y :number|undefined

The y value of the point.

Type:

• number | undefined

Methods

getClassName()

Get the CSS class names for individual points. Used internally where the returned value is set on every point.

Returns:

string .

The class names.

getZone()

In a series with zones, return the zone that the point belongs to.

Returns:

Highcharts.SeriesZonesOptionsObject .

The zone item.

haloPath(size)

Get the path definition for the halo, which is usually a shadow-like circle around the currently hovered point.

Parameters:

Name	Type	Description
size	number	The radius of the circular halo.

Returns:

Highcharts.SVGPathArray .

The path definition.

init(series, options [, x])

Initialize the point. Called internally based on the series.data option.

Parameters:

Name	Type	Argument	Description
series	Highcharts.Series		The series object containing this point.
options	Highcharts.PointOptionsType		The data in either number, array or object format.
x	number	<optional>	Optionally, the X value of the point.

Fires:

• Highcharts.Point#event:afterInit

Returns:

Highcharts.Point .

The Point instance.

onMouseOut()

Runs on mouse out from the point. Called internally from mouse and touch events.

Fires:

• Highcharts.Point#event:mouseOut

onMouseOver( [e])

Runs on mouse over the point. Called internally from mouse and touch events.

Parameters:

Name	Type	Argument	Description
e	Highcharts.PointerEventObject	<optional>	The event arguments.

optionsToObject(options)

Transform number or array configs into objects. Also called for object configs. Used internally to unify the different configuration formats for points. For example, a simple number 10 in a line series will be transformed to { y: 10 }, and an array config like [1, 10] in a scatter series will be transformed to { x: 1, y: 10 }.

Parameters:

Name	Type	Description
options	Highcharts.PointOptionsType	Series data options.

Returns:

Highcharts.Dictionary.<*> .

Transformed point options.

pos(chartCoordinates, plotY)

Get the pixel position of the point relative to the plot area.

Parameters:

Name	Type	Description
chartCoordinates	boolean	If true, the returned position is relative to the full chart area. If false, it is relative to the plot area determined by the axes.
plotY	number | undefined	A custom plot y position to be computed. Used internally for some series types that have multiple y positions, like area range (low and high values).

Returns:

Array.<number> | undefined .

Coordinates of the point if the point exists.

Try it

• Get point's position in pixels.

remove( [redraw] [, animation])

Remove a point and optionally redraw the series and if necessary the axes

Parameters:

Name	Type	Argument	Default	Description
redraw	boolean	<optional>	true	Whether to redraw the chart or wait for an explicit call. When doing more operations on the chart, for example running point.remove() in a loop, it is best practice to set redraw to false and call chart.redraw() after.
animation	boolean | Partial.<Highcharts.AnimationOptionsObject>	<optional>	false	Whether to apply animation, and optionally animation configuration.

Try it

• Remove point and confirm.
• Remove pie slice.
• Remove selected points in Highmaps.

select( [selected] [, accumulate])

Toggle the selection status of a point.

Parameters:

Name	Type	Argument	Default	Description
selected	boolean	<optional>		When true, the point is selected. When false, the point is unselected. When null or undefined, the selection state is toggled.
accumulate	boolean	<optional>	false	When true, the selection is added to other selected points. When false, other selected points are deselected. Internally in Highcharts, when allowPointSelect is true, selected points are accumulated on Control, Shift or Cmd clicking the point.

See also:

• Highcharts.Chart#getSelectedPoints

Fires:

• Highcharts.Point#event:select
• Highcharts.Point#event:unselect

Try it

• Select a point from a button.
• Lasso selection.
• Rectangle selection.
• Select a point in Highmaps.

setNestedProperty(object, value, key)

Set a value in an object, on the property defined by key. The key supports nested properties using dot notation. The function modifies the input object and does not make a copy.

Parameters:

Name	Type	Description
object	T	The object to set the value on.
value	*	The value to set.
key	string	Key to the property to set.

Returns:

T .

The modified object.

setState( [state] [, move])

Set the point's state.

Parameters:

Name	Type	Argument	Description
state	Highcharts.PointStateValue | ""	<optional>	The new state, can be one of 'hover', 'select', 'inactive', or '' (an empty string), 'normal' or undefined to set to normal state.
move	boolean	<optional>	State for animation.

Fires:

• Highcharts.Point#event:afterSetState

sonify( [onEnd])

Play a sonification of a point.

Parameters:

Name	Type	Argument	Description
onEnd	Highcharts.SonificationChartEventCallback	<optional>	Callback to call after play completed

Requires:

• module:modules/sonification

tooltipFormatter(pointFormat)

Extendable method for formatting each point's tooltip line.

Parameters:

Name	Type	Description
pointFormat	string	The point format.

Returns:

string .

A string to be concatenated in to the common tooltip text.

update(options [, redraw] [, animation])

Update point with new options (typically x/y data) and optionally redraw the series.

Parameters:

Name	Type	Argument	Default	Description
options	Highcharts.PointOptionsType			The point options. Point options are handled as described under the series.type.data item for each series type. For example for a line series, if options is a single number, the point will be given that number as the marin y value. If it is an array, it will be interpreted as x and y values respectively. If it is an object, advanced options are applied.
redraw	boolean	<optional>	true	Whether to redraw the chart after the point is updated. If doing more operations on the chart, it is best practice to set redraw to false and call chart.redraw() after.
animation	boolean | Partial.<Highcharts.AnimationOptionsObject>	<optional>	true	Whether to apply animation, and optionally animation configuration.

Fires:

• Highcharts.Point#event:update

Try it

• Update column value.
• Update pie slice.
• Update map area value in Highmaps.