samples/back.html

<html>
    <head>
        <script src="https://cdn.jsdelivr.net/npm/chart.js@4.1.2/dist/chart.umd.min.js"></script>
        <script src="../chartjs-plugin-watermark.js"></script>
        <style type="text/css">
            #myChart {
                max-width: 600px;
                max-height: 400px;
            }
        </style>
    </head>
    <body>
        <div class="myChartDiv">
            <canvas id="myChart" width="600" height="400"></canvas>
        </div>
        <script type="text/javascript">
            var ctx = document.getElementById("myChart");

            var image = new Image();
            image.src = "https://placekitten.com/200/300";

            var myChart = new Chart(ctx, {
                type: 'line',
                data: {
                    labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
                    datasets: [{
                        label: '# of Votes',
                        data: [12, 19, 3, 5, 2, 3]
                    }]
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero:true
                            }
                        }]
                    },
                    watermark: {
                        image: image,

						alignY: "bottom",
						
                        position: "back",
                    }
                }
            });
        </script>
    </body>
</html>