JavaScript JavaScript Object with EasyBuilder Pro HMI Software

[notheretotastejam]

Hello Everybody!

I'm working with a piece of software called EasyBuilder Pro (EBPro), its an HMI development program for Weintek HMI panels, I'm got a built in object that allows me to use JavaScript to code custom objects when the built in objects don't offer the functionality that is needed. I don't like the Trend Chart that is built in and I want to create one with Chart.js. this is my first foray into JavaScript and other than the Structured Text PLC language, I don't have much in the way of coding experience. I can use a canvas to draw things with the JavaScript Object (JS Object) and I have looked at the tutorials from Weintek but they don't touch on what I want to do. Most of the tutorials I can find online center around using JavaScript in conjunction with HTML and the code that is provided as examples just wont translate across into EBPro.

The skinny of it is I cant get anything to be drawn on the canvas, the program says I have "viable source code" and I'm not getting any error messages to give me a trail to follow.

I've included my best attempt at coding a simple line graph from mashing examples of code from Weintek and Chart.js together. try not to laugh too hard. I'm hoping some of the folks on here can point me in the right direction on a couple points that I think I botched:
1. did I even bring the Chart.js library into the program right.
2. I've created a canvas, and referenced the Chart from the Library, why isn't it drawing?
3. I know I need to give the Chart a 2d context from the canvas but I'm not sure how to do that.

thanks in advance for any help

var canvas = new Canvas();
this.widget.add(canvas);

const Chart = require('/chart.min.js');

const myChart = new Chart(canvas.getContext('2d'), {
    Type: 'line',
    Data: {   
        labels: ["January", "February", "March", "April", "May", "June", "July"],
        datasets: [{
            label: "My First dataset",
            backgroundColor: 'rgb(255, 99, 132)',
            borderColor: 'rgb(255, 99, 132)',
            data: [0, 10, 5, 2, 20, 30, 45],
        }]
    },
        options: {}
    
});
this.widget.add(myChart);
myChart.stroke();