Read more  <a href="https://www.appsloveworld.com/how-to-create-a-stacked-bar-chart-using-chart-js-example/">How to Create a Stacked Bar Chart Using Chart Js Example?</a>
<div style="margin-left:5%;margin-right:5%">
        <canvas id="StackedbarChartcanvas" style="width:80%"></canvas>
    </div>
  var StackedbarChart = {
            labels: [
                "Jan",
                "Feb",
                "Mar",
                "Apr",
                "May",
                "June",
                "July",
                "Aug",
                "Sep",
                "Oct"
            ],
            datasets: [
                {
                    label: "Organic terrific",
                    backgroundColor: "red",
                    borderColor: "red",
                    borderWidth: 1,
                    data: [42, 56, 26, 52, 66, 87, 51, 42, 32, 88]
                },
                {
                    label: "Soical terrific",
                    backgroundColor: "blue",
                    borderColor: "blue",
                    borderWidth: 1,
                    data: [120, 52, 69, 62, 12, 45, 110, 52, 39, 75]
                },
                {
                    label: "Referral terrific",
                    backgroundColor: "green",
                    borderColor: "green",
                    borderWidth: 1,
                    data: [45, 12, 78, 23, 87, 92, 63, 47, 29, 79]
                },
                {
                    label: "Paid terrific",
                    backgroundColor: "lightblue",
                    borderColor: "lightblue",
                    borderWidth: 1,
                    data: [45, 88, 112, 41, 48, 69, 52, 61, 59, 69]
                }
            ]
        };

        var StackedbarChartOptions = {
            responsive: true,
            plugins: {
                legend: {
                    position: 'right',//this option is used for place legend on the right side of bar chart
                }
            },
            scales: {
                x: {
                    stacked: true,// this option is used to make the bars stacked
                },
                y: {
                    stacked: true
                }
            },
            title: {
                display: true,
                text: "Chart.js Stacked Bar Chart"
            }
        }

        window.onload = function () {
            var chartData = {
                type: "bar",
                data: StackedbarChart,
                options: StackedbarChartOptions
            }
            new Chart("StackedbarChartcanvas", chartData);
        };

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.min.js