Colocar dois datasets na mesma coluna no gráfico de barras do Chart.js

[Luis Felipe Rebecca 0]

Galera preciso colocar dois datasets na mesma coluna do gráfico de barras,desse jeito:

 

 

Meu  gráficos está assim:

 

 

Código:

 

<script>
        var ctx = document.getElementById('chartBar').getContext('2d');
        var stackedBar = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ["Jan", "Fev", "Mar", "Abr", "Mai", "Jun", "Jul", "Ago", "Set", "Out", "Nov", "Dez"],
                datasets: [{
                data: [2, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20,0, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20],
                backgroundColor: 'rgb(0, 128, 160)',
                borderColor: 'rgb(0, 128, 160)',
                }]
            },
                options: {
                    scaleBeginAtZero : true,
                    scaleShowGridLines : true,
                    scaleGridLineColor : "rgba(0,0,0,.005)",
                    scaleGridLineWidth : 0,
                    scaleShowHorizontalLines: true,
                    scaleShowVerticalLines: true,
                    barShowStroke : true,
                    barStrokeWidth : 0,
                    tooltipCornerRadius: 2,
                    barDatasetSpacing : 3,
                    scales: {
                    xAxes: [{
                        stacked: true,
                        ticks: {


                        }
                    }],
                            yAxes: [{
                                stacked: true
                            }]
                    }
                }
        });
    </script>

<div class="col-md-6"> <canvas id="chartBar" height="150"></canvas></div>

Alguém pode me ajudar?

[William Bruno 1501]

olha pra estrutura, já tentou:

datasets: [{
   data: [2, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20,0, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20],
   backgroundColor: 'rgb(0, 128, 160)',
   borderColor: 'rgb(0, 128, 160)'
},
{ 
   data: [2, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20,0, 10, 5, 6, 20, 30, 45,20, 10, 5, 2, 20], 
   backgroundColor: 'rgb(255, 0, 160)', 
   borderColor: 'rgb(255, 0, 160)' 
}]

[Luis Felipe Rebecca 0]

Já tentei sim! ele fica encima dos que já tem, juntando os dois e fazendo uma coluna só.

 

[William Bruno 1501]

Esse exemplo aqui é o que você quer:
http://www.chartjs.org/samples/latest/charts/bar/vertical.html

 

Certeza que é uma opção a mais para virar dois. Tipo `label: 'Dataset 1',`

[Luis Felipe Rebecca 0]

Consegui achar uma solução aqui!!

 

options: {
                tooltips: {
                    callbacks: {
                        label: function (t, d) {
                            var xLabel = d.datasets[t.datasetIndex].label;
                            var yLabel = t.yLabel >= 1000 ? '$' + t.yLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : '$' + t.yLabel;
                            return xLabel + ': ' + yLabel;
                        }
                    }
                },
                legend: {
                    display: false,
                    position: 'top',
                },
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true,
                            callback: function (value, index, values) {
                                if (parseInt(value) >= 1000) {
                                    return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                                } else { return '$' + value; }
                            }
                        }
                    }]
                }
            },
            plugins: [{
                beforeDraw: function (chart) {
                    var labels = chart.data.labels;
                }
            }]

Coloquei esse trecho que achei em um site gringo e funcionou!

Obrigado!