Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript JavaScript Object with EasyBuilder Pro HMI Software

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


JavaScript:
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();
 

New Threads

Buy us a coffee!

Back
Top Bottom