Docs Back to Docs

graph » zoom

zoom

[ root » graph » zoom ]

Chart zooming is an interactive chart feature that allows users to select a zoom area by clicking and dragging. Use the zoom object to style the zoom area, add zooming labels, turn on shared zooming, and more. Refer to the Zooming, Scrollbar, and Preview Chart Tutorial for more information.

Note: Make sure the zooming attribute is set to true in the applicable scale-x and/or scale-yobject(s). You can also specify the starting and ending values that the chart will zoom to by default with the zoom-to or zoom-to-values array.

AttributeTypeInfo
alphaNumeric

Sets the transparency level of the object. Values must range between 0.0 and 1.0, with 0.0 being completely transparent and 1.0 being completely opaque. Note that values require the leading 0 before the decimal point.

0.3 | 0.4 | 0.9 | ...

background-color
backgroundColor		String

Sets the background color of the object. Colors can be entered by name (e.g., "purple", "blue"), hexadecimal notation (e.g., "#666699", #33ccff"), or RGB notation (e.g., "rgb(255,0,0)", "rgb(0,0,255)").

"none" | "transparent" | "purple" | "#33ccff" | "rgb(100, 15, 15)" | ...

border-color
borderColor		String

Sets the border color of the object.

"none" | "transparent" | "purple" | "#33ccff" | "rgb(100, 15, 15)" | ...

border-width
borderWidth		Mixed

Sets the border width of the object.

1 | 3 | | "6px" | ...

labelObject

To create zooming labels. In the "label" object, add a "visible" attribute and set the value to true.

{...}

preserve-zoom
preserveZoom		Boolean

API charts only: Sets whether the zoom level is preserved on chart data alteration or reloads.

true | false | 1 | 0

sharedBoolean

Sets whether simultaneous chart zooming is applied to two or more charts in a graphset. Refer to the Shared Interactions Tutorial for more information.

true | false | 1 | 0