graph » crosshair-x

crosshair-x

[ root » graph » crosshair-x]

Crosshairs are interactive labels that appear when users hover over the data points (or node values) on your chart. They can appear against the x- and/or y-axis, and are highly customizable. Crosshairs are much more efficient and performant compared to chart tooltips. Refer to the Crosshairs Tutorial for more information.



AttributeTypeDescription
alphaNumberSets the opacity on the marker, with 0 being fully transparent and 1 being fully opaque. Note that decimal value requires the leading 0.
Default Value: 1
classStringSets a class value on the object.
Default Value: null
dataN
data-n
AnyPrefix attribute or array using "data-" to define a custom token.
exactBooleanSet to `true` to highlight plot nodes only when guide is directly next to the node. Set to `false` (default) to highlight plot nodes closest to guide.
idStringSets the id of the object.
Default Value: ''
lineCap
line-cap
StringSets the stroke-linecap attribute on SVGs
Accepted Values: ['butt', 'round', 'square']
Default Value: 'butt'
lineColor
line-color
StringSets the line color of the object, applicable on non-closed shapes. See also border-color for closed shapes.
Default Value: '#000'
lineGapSize
line-gap-size
NumberCan be used to create custom dashed or dotted lines when used with line-segment-size. This will control the size of the gaps between each line segment.
Default Value: 0
lineJoin
line-join
StringSets the stroke-linejoin attribute on SVGs
Accepted Values: ['round', 'miter']
Default Value: 'round'
lineSegmentSize
line-segment-size
NumberCan be used to create custom dashed or dotted lines when used with line-gap-size. This will control the size of the visible segment of line.
Default Value: 0
lineStyle
line-style
StringSets the line style of the object.
Accepted Values: ['dashdot', 'dashed', 'dotted', 'solid']
Default Value: ''
lineWidth
line-width
NumberSets the line width of the object, applicable on non-closed shapes. See also border-width for closed shapes.
Default Value: 0
markerObjectSets the styling for markers.
mediaRules
media-rules
Array.<Object>Configure media rules.
plotLabel
plot-label
ObjectConfigure crosshair plot label
reverseSeries
reverse-series
BooleanReserves the order of items in plotLabel of stacked charts.
Chart types: Stacked Bar
scaleLabel
scale-label
ObjectConfigure crosshair scale label
shadowBooleanSets whether the object's shadow is visible or not. Has limited effect on HTML5 implementation.
Default Value: false
shadowAlpha
shadow-alpha
NumberSets the transparency of the shadow of the object. The higher the value, the less transparent the shadow will be.
Default Value: 0.75
shadowAngle
shadow-angle
NumberSets the angle of the shadow underneath the object.
Default Value: 45
shadowBlur
shadow-blur
NumberSets the blur effect size for the shadow of the object. Has limited effect on HTML5 implementation.
Default Value: 0
shadowColor
shadow-color
StringSets the color of the shadow of the object.
Default Value: '#999'
shadowDistance
shadow-distance
NumberSets the distance between the shadow and the object.
Default Value: 2
sharedBooleanEnables shared crosshairs when there are multiple charts in graphset.
singleLine
single-line
BooleanUsed with `exact: false` to show all plot labels through only one crosshair line and scale label. Typically used when null values are present and mulitple guide are showing.
Default Value: false
Introduced in: v2.6.1
stickyBooleanCreates sticky object. Use this with `timeout` to specify how long for object to stick to chart.
Default Value: null
timeoutNumberTime in milliseconds for object to remain sticky. Use this with `sticky` to specify whether object should stick to chart.
Default Value: null
triggerStringSets the mode used to display crosshair plotLabels. The "move" setting displays plotLabel for all nodes. The "hover" setting displays plotLabel when node is hovered.
Accepted Values: ['move', 'hover']
Default Value: 'move'
visibleBooleanSets the visibility of the object. Allows you to turn off the object without removing lines of JSON.
Default Value: true