條形圖在彼此頂部堆疊數據

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