Chartjs-Mixed chart not showing both charts simultaneously chart.js

0👍

Have been able to resolve stacking line and bar in same dataset. Following is the working code.

<script>
            var file = 'TempData.csv';
            d3.csv(file).then(makeChart);
            function makeChart(days) {
                var dayLabel = days.map(function(d){return d.Time});
                var dayTemp = days.map(function(d) {return d.Value});
                var dayHeap = days.map(function(d){return d.heap});
                //Set Min for better visiable range
                var minX = d3.min(dayTemp);
                minX -= 10;

                var chart = new Chart('chart', {
                    type: 'bar',
                    data: {
                        labels: dayLabel,
                        datasets: [
                            {
                                type:'bar',
                                data: dayTemp,
                                backgroundColor: "rgba(217,83,79,0.75)"

 },
                            {
                                type:'line',
                                data:dayHeap,
                                backgroundColor: "rgba(51,51,51,0.5)"
                            },
                        ]
           //         },

                    },
                    options: {
                        title: {
                            display: true,
                            text: file
                        },
                        legend: {
                            display: true
                        },
                        scales: {
                            xAxes: [
                                {
                                    ticks: {
                                        suggestedMin: minX,
                                    }
                                }
                            ]
                        }
                    }
                }
            )};
        </script>

Leave a comment