Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
945
stacked100SplineArea not showing data
posted

Trying to get a stacked chart to show up on page, so far have axes showing but no plot and no errors...

Have used the same data for other charts with no problems, so I feel that the data is OK, and general methodology is correct. But can't find what is wrong 

js code used to bind

$("#drchart").igDataChart({
width: "100%",
height: "300px",
title: "Proportion of area under category",
dataSource: gldata,

axes: [
{
name: "xAxisdr",
type: "categoryDateTimeX",
dateTimeMemberPath: "Date",
labelVisibility: "visible",
formatLabel: function(value){
return value.toString('MMMM yyyy');
},
title: "Time"
},
{
name: "yAxisdr",
type: "numericY",
title: "Proportion within Category",
labelVisibility: "visible"
}
],
series: [function () { // a self executing function to create the series initialization object
var seriesObj = {
name: "parent",
xAxis: "xAxisdr",
yAxis: "yAxisdr",
type: "stacked100SplineArea",
outline: "transparent",
dataSource: gldata,
series: [
{
name: "gt95",
type: "stackedFragment",
valueMemberPath: "gt95"
},
{
name: "gt925",
type: "stackedFragment",
valueMemberPath: "gt925"
},
{
name: "gt90",
type: "stackedFragment",
valueMemberPath: "gt90"
},
{
name: "gt70",
type: "stackedFragment",
valueMemberPath: "gt70"
},
{
name: "gt50",
type: "stackedFragment",
valueMemberPath: "gt50"
},
{
name: "gt30",
type: "stackedFragment",
valueMemberPath: "gt30lt50"
},
{
name: "lt30",
type: "stackedFragment",
valueMemberPath: "lt30"
},
{
name: "lt10",
type: "stackedFragment",
valueMemberPath: "lt10"
},
{
name: "lt75",
type: "stackedFragment",
valueMemberPath: "lt75"
},
{
name: "lt5",
type: "stackedFragment",
valueMemberPath: "lt5"
}]
};
return seriesObj;
}()],
horizontalZoomable: true,
verticalZoomable: false,
windowResponse: "immediate"
});

have attached the data file I'm using, a comma separated file.

here the code I use to convert gl.csv to js object

getCSVFile('./data/gl.csv', function(csvobj){
gldata = csvobj;
$.each(gldata,function(indx,val){
val.Date = Date.parse(val.Date);
});
});
function getCSVFile(fileurl, callback){
var txtFile = new XMLHttpRequest();
txtFile.onreadystatechange = function () {
if (txtFile.readyState == 4 && txtFile.status == 200) {
var csvobj = $.csv.toObjects(txtFile.responseText);
callback(csvobj);
}
};
txtFile.open("GET", fileurl, true);
txtFile.send();
}

using Date.js for date conversions.

What am I doing wrong?

David

Parents
No Data
Reply
  • 945
    Verified Answer
    Offline posted

    Found that the data handling of the stacked chart is different from the standard chart.

    Standard chart handles numbers as strings where the stacked version don't.

    So changed the csv file handling to Papa Parse

    Papa.parse('./data/gl.csv',{
    download: true,
    dynamicTyping: true,
    header: true,
    complete: function(data) {
    gldata = data.data;
    $.each(gldata,function(i,d){
    d.Date = Date.parse(d.Date);
    });
    }
    });

    Works a charm now.

    Has infragistics got a csv file reader?

Children