Class: Point

Highcharts. Point

new Point()

The Point object. The point objects are generated from the series.data configuration objects or raw numbers. They can be accessed from the Series.points array. Other ways to instantiate points are through Highcharts.Series#addPoint or Highcharts.Series#setData.

Members

<static> graphic :Highcharts.SVGElement

The graphic representation of the point. 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:

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

colorIndex :number

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

dataGroup :Highcharts.SVGElement|undefined

Highstock 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:

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 :object

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

Type:
  • object

percentage :number

The percentage for points in a stacked series or pies.

Type:
  • number

properties :*

In Highmaps, 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:

series :Highcharts.Series

The series object associated with the point.

Type:

total :number

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

Type:
  • number

visible :boolean

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

Type:
  • boolean

x :number

The x value of the point.

Type:
  • number

y :number|undefined

The y value of the point.

Type:
  • number | undefined

Methods

cancelSonify( [fadeOut])

Cancel sonification of a point. Calls onEnd functions.

Parameters:
Name Type Argument Default Description
fadeOut boolean <optional>
false

Whether or not to fade out as we stop. If false, the points are cancelled synchronously.

Requires:
  • module:modules/sonification

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.

getLabelConfig()

Return the configuration hash needed for the data label and tooltip formatters.

Returns:
Highcharts.PointLabelObject .

Abstract object used in formatters and formats.

getZone()

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

Returns:
Highcharts.PlotSeriesZonesOptions .

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 number | object | Array.<(number|string)> | null

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 Description
e Highcharts.PointerEventObject

The event arguments.

optionsToObject(options)

Transform number or array configs into objects. 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 number | object | Array.<(number|string)> | null

The input option.

Returns:
object .

Transformed options.

remove(redraw [, animation])

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

Parameters:
Name Type Argument Default Description
redraw boolean

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 | Highcharts.AnimationOptionsObject <optional>
false

Whether to apply animation, and optionally animation configuration.

Try it

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:
Fires:
  • Highcharts.Point#event:select
  • Highcharts.Point#event:unselect
Try it

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 object

The object to set the value on.

value *

The value to set.

key string

Key to the property to set.

Returns:
object .

The modified object.

setState( [state] [, move])

Set the point's state.

Parameters:
Name Type Argument Description
state string <optional>

The new state, can be one of '' (an empty string), hover or select.

move boolean <optional>

State for animation.

Fires:
  • Highcharts.Point#event:afterSetState

sonify(options)

Sonify a single point.

Parameters:
Name Type Description
options Highcharts.PointSonifyOptionsObject

Options for the sonification of the point.

Requires:
  • module:modules/sonification
Try it

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 number | object | Array.<(number|string)> | null

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 | Highcharts.AnimationOptionsObject <optional>
true

Whether to apply animation, and optionally animation configuration.

Fires:
  • Highcharts.Point#event:update
Try it

zoomTo()

Highmaps only. Zoom in on the point using the global animation.

Requires:
  • module:modules/map
Try it