Operations with Chart Data

Getting Item Value

You can get the value of any item in the following way:

Getting value of the year property

$$("chart").attachEvent("onItemClick", function(id){
    id = this.getItem(id).year;
    alert(id);
});

Related sample:  Chart: Events

Adding Items

While adding an item, make use of the add method and state new data as an object and position of the new item:

var counter = 12;
    function addNew () {
        $$("barChart").add({
            year:"'"+counter, 
            sales:"some_value"
        });
    counter++;
}

Additionally, you can define a counter that sets the starting position of the new items to observe dataset integrity.

Deleting Items

To delete an item or several items, you should pass the id of the item (or an array of items' ids) into the remove function.

$$("barChart").remove("item_id"); // to delete a single item
 
$$("barChart").remove(["idA","idB","idC","idD"]); // to delete multiple items

You can also delete first and last items from the dataset as follows:

• get the id of the first/last item using the related methods: getFirstId or getLastId
• apply the remove method

function deleteFirst(){
    $$("barChart").remove($$("barChart").getFirstId());
}

Related sample:  Chart: Adding/Deleting Data Items

Study the corresponding chapter of the manual to learn more about adding and deleting of items.

Sorting Data

Here you use the sort method that takes property from the initial dataset and the sorting manner (ascending or descending) as parameters.

$$('chart').sort('#year#','desc');

Related sample:  Chart: Sorting

Filtering Data

As a rule, the filter method takes a function as parameter. In the function you specify the data you want to be filtered.

Make the chart show you only sales exceeding 50.

function filter1(){
    $$('chart').filter(function(obj){
        return obj.sales >50;
    });
}

Related sample:  Chart: Filtering

Back to top