Wijmo 2.0.8 Released

Wijmo 2.0.8 has officially released. We have been doing plenty of bug fixes and feature enhancements since 2.0.0.

Chart Data-binding Lands in Wijmo!

The biggest new feature in this release is data-binding support in our charts. We have added options that provide binding support for anything form a simple bar chart to a complex grouped bar chart. We have added the following options to the Charts

dataSource

Option added to all defined widgets that will support binding to dataView Type: array

data.x.bind

Defines field name used from dataSource instead of explicitly defining data as an array in the x option. This will be shared for all series in the seriesList unless overridden. Type: string

seriesList.data.x.bind

Defines field name used from dataSource instead of explicitly defining data as an array in the x option. Type: string

seriesList.data.y.bind

Defines field name used from dataSource instead of explicitly defining data as an array in the y option. Type: string

Single-series Charts Bound to Array

For single series charts the dataSource should be set on the chart widget option. See this sample online

//Create Data  
var data = [{  
    Device: 'Desktops',  
    Count: 5  
},{  
    Device: 'Notebooks',  
    Count: 3  
},{  
    Device: 'Tablets',  
    Count: 7  
}];  

$("#wijbarchart").wijbarchart({  
    dataSource: data,  
    seriesList: [{  
        legendEntry: true,  
        data: { x: { bind: "Devices" }, y: { bind: "Count" }}  
    }]  
});  

Multi-series Charts with Shared Data Source

For multiple series charts that have a common dataset the dataSource should be set on the chart widget option. See this sample online

//Create Data  
var data = [{  
    Device: 'Desktops',  
    Count: 5,  
    Price: 900  
},{  
    Device: 'Notebooks',  
    Count: 3,  
    Price: 700  
},{  
    Device: 'Tablets',  
    Count: 7,  
    Price: 500  
}];  

$("#wijbarchart").wijbarchart({  
    dataSource: data,  
    data: { x: { bind: "Devices" }},  
    seriesList: [{  
        legendEntry: true,  
        data: { y: { bind: "Count" }}  
    },{  
        legendEntry: true,  
        data: { y: { bind: "Price" }}  
    }]  
});  

Multi-series Charts with Different Data Sources

For charts with multiple series, a dataSource should be set on the chart widget option, unless different x or y fields are being used. In that case, the dataSource option can be defined for each series in the seriesList. See this sample online

var dataWest = [{  
    Device: 'Desktops',  
    Count: 5  
}, {  
    Device: 'Notebooks',  
    Count: 3  
}, {  
    Device: 'Tablets',  
    Count: 7  
}],  

dataEast = [{  
Device: 'Desktops',  
Count: 1  
}, {  
Device: 'Notebooks',  
Count: 6  
}, {  
Device: 'Tablets',  
Count: 8  
}],  

dataCentral = [{  
Device: 'Desktops',  
Count: 2  
}, {  
Device: 'Notebooks',  
Count: 4.5  
}, {  
Device: 'Tablets',  
Count: 2.5  
}];  

$("#wijbarchart").wijbarchart({  
    seriesList: [{  
     dataSource: dataWest,  
     label: "West",  
     legendEntry: true,  
     data: { x: { bind: "Device" }, y: { bind: "Count"} }  
    }, {  
     dataSource: dataEast,  
     label: "East",  
     legendEntry: true,  
     data: { x: { bind: "Device" }, y: { bind: "Count"} }  
    }, {  
     dataSource: dataCentral,  
     label: "Central",  
     legendEntry: true,  
     data: { x: { bind: "Device" }, y: { bind: "Count"} }  
    }]  
});  

Go get it!

Make sure to download the latest version of Wijmo and read the change log!