条形图在彼此顶部堆叠数据

Question

我正在使用this chart implementation。然而，它散布我的数据而不是堆叠在彼此的顶部。

我想堆积我的第一个数组在1970年，第二个在1975年。换句话说，我想有两个堆叠的酒吧，而不是有五个。我想保留我的数据数组，而不是将它们分开。

function createChart() { 
    $("#chart").kendoChart({ 
    title: { 
     text: "World population by age group and sex" 
    }, 
    legend: { 
     visible: false 
    }, 
    seriesDefaults: { 
     type: "column" 
    }, 
    series: [{ 
     name: "1970", 
     stack: true, 
     data: [85, 92, 98, 104, 54] 
    }, { 
     name: "1975", 
     stack: true, 
     data: [49, 50, 55, 56, 95] 
    }], 


    seriesColors: ["green", "yellow", "#dc5c71", "#e47f8f", "#eba1ad", 
     "#009bd7", "#26aadd", "#4db9e3", "#73c8e9", "#99d7ef" 
    ], 
    valueAxis: { 
     labels: { 
     template: "#= kendo.format('{0:N0}', value)#" 
     }, 
     line: { 
     visible: false 
     } 
    }, 
    categoryAxis: { 
     categories: [1970, 1975], 
     majorGridLines: { 
     visible: false 
     } 
    }, 
    tooltip: { 
     visible: true, 
     template: "#= series.stack #s, age #= series.name #" 
    } 
    }); 
} 

$(document).ready(createChart); 
$(document).bind("kendo:skinChange", createChart); 

Fiddle

电流输出：

所需的输出：类似于如下

Answer 1

尝试安排你的数据是这样的：

$("#chart").kendoChart({ 
    title: { 
     text: "World population by age group and sex" 
    }, 
    theme: "Metro", 
    legend: { 
     visible: false 
    }, 
    seriesDefaults: { 
     type: "column" 
    },    
    series: [ 
     { 
     name: "item1", 
     stack: true, 
     data: [85, 49] 
    },{ 
     name: "item2", 
     stack: true, 
     data: [ 92, 50] 
    },{ 
     name: "item3", 
     stack: true, 
     data: [98, 55] 
    },{ 
     name: "item4", 
     stack: true, 
     data: [104, 56] 
    },,{ 
     name: "item5", 
     stack: true, 
     data: [54,95] 
    }, 
    ], 
    valueAxis: { 
     labels: { 
      template: "#= kendo.format('{0:N0}', value)#" 
     }, 
     line: { 
      visible: false 
     } 
    }, 
    categoryAxis: { 
     categories: [1970, 1975], 
     majorGridLines: { 
      visible: false 
     } 
    }, 
    tooltip: { 
     visible: true, 
     template: "#= series.name # #= value #" 
    } 
}); 

更新DEMO

更新FIDDLE