Documentation

Chart

Overview

Chart is a ui-related component that inherits from view and helps present data in different graphic figures like colored columns, pie pieces or lines. Like all the data-presenting components it takes initial data in various formats.

Initialization

The most important chart properties include type, template and value for data as well as criteria for data presenting (e.g. step of X axis in a bar chart). Specify the chart ID if you are going to work with it later.

Initialization of a Bar Chart

 webix.ui({
            view:"chart",
            type:"bar",
            value:"#sales#",
            color:"#f6960a",
            border:true,
            xAxis:{
                template:"'#year#"
            },
            yAxis:{
                start:0,
                end:100,
                step:10,
                ...
                }
            },
            data: dataset
        });

Related sample:  Chart: XML Dataset

To learn about all the chart properties, please refer to the corresponding chapter of the manual.

Working with Chart

API Reference

Methods, parameters and events

Related Articles

Back to top