var BarchartwithlineDataobj = {
            labels: [
                "Jan",
                "Feb",
                "Mar",
                "Apr",
                "May",
                "June",
                "July",
                "Aug",
                "Sep",
                "Oct",
                "Nov",
                "Dec"
            ],
            datasets: [
                {
                    label: "Projected sales",
                    backgroundColor: "red",
                    borderColor: "red",
                    borderWidth: 1,
                    data: [42, 56, 9, 52, 66, 87, 51, 42, 32, 88,150,125],
                    order: 1
                },
                {
                    label: "Actual Sales",
                    backgroundColor: "blue",
                    borderColor: "blue",
                    borderWidth: 1,
                    data: [0, 52, 94, 62, 12, 45, 110, 52, 39, 75,115,175],
                    type: 'line',//sepcify this dataset is for line chart
                    order: 0 //to set the linechart on top of barchart
                }
            ]
        };

        var LinebarChartOptions = {
            responsive: true,
            plugins: {
                legend: {
                    position: 'right',//this option is used for place legend on the right side of bar chart
                }
            },
            title: {
                display: true,
                text: "Chart.js Bar Chart with Line Chart"
            }
        }

        window.onload = function () {
            var chartData = {
                type: "bar",
                data: BarchartwithlineDataobj,
                options: LinebarChartOptions
            }
            new Chart("barchartwithlinechartcanvas", chartData);
        };