0

I have Chart.js stacked bar chart where I am displaying the number of applications received for the past 6 months, say Jan to June. Now I am stuck with this: I have to color the bars based on the status as well, so one bar can have multiple colors. How can I do this?

Current code:

$.ajax({
    url: "../Overiew/GetCandidate",
    data: '',
    type: "GET",
    dataType: "json",
    success: function (data) {
        console.log(data);
        var date = [];
        for (var i in data) {
            date.push(data[i].can_main_created_month
            }
            console.log(date);
            var count = [];
            for (var i = 0; i < date.length; i++) {
                if (count[date[i]]) {
                    count[date[i]]++;
                } else {
                    count[date[i]] = 1;
                }
            }
            count = Object.keys(count).map(v => count[v]);
            console.log(count);
            var status = [];
            for (var i in data) {
                status.push(data[i].can_main_status);
            }
            console.log(status);
            var inprocess = status[0]; //Blue Color
            var hired = status[1]; //Green Color
            var rejected = status[0]; //Red Color
            var data = {
                labels: ["January", "February", "March", "April", "May", "June"],
                datasets: [{
                    label: "Number of Records",
                    fillColor: "rgba(151,187,205,0.5)",
                    strokeColor: "rgba(151,187,205,0.8)",
                    highlightFill: "rgba(151,187,205,0.75)",
                    highlightStroke: "rgba(151,187,205,1)",
                    data: [count[1], count[2], 0, 0, count[0], 0]
                }]
            };
            var ctx = $('#barChart').get(0).getContext("2d");
            var barchart = new Chart(ctx).Bar(data);
        }
    }
});

Current Stacked Bar Chart:

Current Stacked Bar Chart

Tot Zam
  • 8,406
  • 10
  • 51
  • 76
  • It is right now a bar chart but i want to make it stacked based on the status – Pooja Patil May 17 '17 at 06:16
  • Possible duplicate of [Gradient color for each bar in a bar graph using ChartJS](https://stackoverflow.com/questions/43630914/gradient-color-for-each-bar-in-a-bar-graph-using-chartjs) – Tot Zam May 23 '17 at 14:07

0 Answers0