package chartjs

  1. Overview
  2. Docs

The configuration is used to change how the chart behaves. There are properties to control styling, fonts, the legend, etc.

Chart.js animates charts out of the box. A number of options are provided to configure how the animation looks and how long it takes.

Layout configurations.

The chart legend displays data about the datasets that are appearing on the chart.

The chart title defines text to draw at the top of the chart.

While chart types provide settings to configure the styling of each dataset, you sometimes want to style all datasets the same way. A common example would be to stroke all of the bars in a bar chart with the same colour but change the fill per dataset. Options can be configured for four different types of elements: arc, lines, points, and rectangles. When set, these options apply to all objects of that type unless specifically overridden by the configuration attached to a dataset.

Plugins are the most efficient way to customize or change the default behavior of a chart. This option allows to define plugins directly in the chart plugins config (a.k.a. inline plugins).

Sometimes you need a very complex legend. In these cases, it makes sense to generate an HTML legend. Charts provide a generateLegend() method on their prototype that returns an HTML string for the legend. NOTE legendCallback is not called automatically and you must call generateLegend yourself in code when creating a legend using this method.

method responsive : bool Js_of_ocaml.Js.t Js_of_ocaml.Js.prop

Resizes the chart canvas when its container does.

method responsiveAnimationDuration : int Js_of_ocaml.Js.prop

Duration in milliseconds it takes to animate to new size after a resize event.

method maintainAspectRatio : bool Js_of_ocaml.Js.t Js_of_ocaml.Js.prop

Maintain the original canvas aspect ratio (width / height) when resizing.

method aspectRatio : float Js_of_ocaml.Js.optdef_prop

Canvas aspect ratio (i.e. width / height, a value of 1 representing a square canvas). Note that this option is ignored if the height is explicitly defined either as attribute or via the style.

Called when a resize occurs. Gets passed two arguments: the chart instance and the new size.

method devicePixelRatio : float Js_of_ocaml.Js.optdef_prop

Override the window's default devicePixelRatio.

The events option defines the browser events that the chart should listen to for tooltips and hovering.

Called when any of the events fire. Called in the context of the chart and passed the event and an array of active elements (bars, points, etc).

Called if the event is of type 'mouseup' or 'click'. Called in the context of the chart and passed the event and an array of active elements.