v7.3.0

Charts
Feature

Adds interactive charting to a Grid. Charts can be created from a selection of Grid data and updated in realtime as data changes. Supports many common chart types with extensive styling and customization options.

A context menu item New Chart is added that opens a popup containing a ChartDesigner using the data in the grid's current selection.

For an explanation of the various options available in the editor popup, see Chart.

This feature is disabled by default.

const grid = new Grid({
    features : {
        charts : true
    }
});

See also

No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class
  • chartDesigner : Object

    (Optional) Configuration options to provide to the ChartDesigner

  • minimal : Booleanfalse

    Whether to display in minimal mode, where popup title is hidden, chart preview occupies full area, and settings panel is minimized. Setting this to true also sets minimal : true on the child ChartDesigner.

    Has a corresponding runtime minimal property.

  • popup : PopupConfig

    (Optional) Configuration options to provide to the Popup.

Properties

Properties are getters/setters or publicly accessible variables on this class
  • isCharts : Booleantrue
    READONLY
    static
    ADVANCED
    Identifies an object as an instance of Charts class, or subclass thereof.
  • minimal : Booleanfalse

    Whether to display in minimal mode, where popup title is hidden, chart preview occupies full area, and settings panel is minimized. Setting this to true also sets minimal : true on the child ChartDesigner.

    Has a corresponding minimal config.

  • isCharts : Booleantrue
    READONLY
    ADVANCED
    Identifies an object as an instance of Charts class, or subclass thereof.

Functions

Functions are methods available for calling on the class
    • openPopup( )
      : Promise
      ASYNC

      Open the chart designer popup with the current Grid selection as data source.

    id: charts

    Source path

    Grid/feature/Charts.js

    Demo

    examples/charts

    Contents