Sparkline

A sparkline widget.

Included in: dx.chartjs.js, dx.all.js

The dxSparkline widget represents a small chart that contains only one series. Due to its size, the data represented by a sparkline is visualized in a highly condensed way. Since sparklines are compact, they are usually placed in a table or embedded in text.

The dxSparkline widget, like any other DevExtreme data visualization widget, can be created using one of three possible approaches: jQuery, Knockout or AngularJS. The following code demonstrates how to create the dxSparkline widget within the "sparklineContainer" container using the jQuery approach.

<script>
  $(function () {
    $('#sparklineContainer').dxSparkline({
      //Options of the configuration object are specified here
    });
  });
</script>

To configure the dxSparkline widget, pass a configuration object as the parameter of the constructor. The fields of this object represent the widget configuration options. To specify these options, set the required values to the corresponding fields. Refer to the Configuration section to find the options that can be specified for the dxSparkline widget.

View Demo Watch Video

Configuration

An object that specifies configuration options for the dxSparkline widget.

Methods

This section describes the methods that can be used in code to manipulate objects related to the dxSparkline widget.

Events

This section describes events fired by the widget.