Loading Data

Pivot Chart supports both inline and external (including server-side) data in any of the supported data types: XML, JSON, JsArray and CSV.

Inline Data

Inline Data (JSON)

var pivot_dataset = [
    {"name": "China", "year": 2005, "form": "Republic", "gdp": 181.357, "oil": 1.545},
    {"name": "China", "year": 2006, "form": "Republic", "gdp": 212.507, "oil": 1.732},
    //...
]

To load inline data during the component initialization, make use of data property:

webix.ui({
    view:"pivot-chart",
    id:"pivot",
    data:pivot_dataset
});

To load inline data after the component initialization, for instance, on some event, use the parse function:

$$("pivot").parse(pivot_dataset);

Related sample:  Initialization with Inline Data

External Data

Either you get data from an external file or by a server-side script,use the following pattern:

  • If you load the data during component initialization, specify the path to this file/script as value of url:
{
    view:"pivot-chart",
    url:"../load.php" // or "../data.json"
}
  • If you load data after the component has been initialized (e.g. on some event), use the load function:
$$("pivot").load("../load.php");
//or
$$("pivot").load("../data.json");

In essence, Pivot Chart complies to standard Webix Data Loading rules.

Related sample:  Loading Data

Data Export

You can export the result to PDF, Excel and PNG by using the corresponding methods - toExcel, toPDF and toPNG:

$$("pivot").toPDF();
$$("pivot").toExcel();
$$("pivot").toPNG();
Back to top
If you have not checked yet, be sure to visit site of our main product Webix javascript dashboard framework and page of javascript pivot grid product.