Rpraph is not showing in canvas

Question

<canvas id = "myCanvas" height = "385%" width = "100%">  
<script type="text/javascript" charset="utf-8">  <pre>
var c = document.getElementById("myCanvas");  
var ctx = c.getContext("2d");  
var bar = new RGraph.Bar(ctx);  
bar.Set('test', [4.5,3.5,3,4,3.5,2.5,2.5,3]);  
bar.Set('chart.gutter', 7);  
bar.Set('chart.colors', ['blue']);  
bar.Set('chart.labels'["Avengers:InfinityWar","Deadpool2","BlackPanther","Padmavat","Sanju","Gotti","Jurasic World:Fallen World","Rampage"]);
bar.Draw();</pre>
</script>
</canvas>

Error: Uncaught TypeError: Cannot read property 'getContext' of null at new RGraph.Bar (file:///F:/New%20folder%20(2)/website/RGraph.bar.js:46:51) at file:///F:/New%20folder%20(2)/website/online_booking.html:149:14

Answer 1

There were a few problems with your configuration most notable of which was that the JavaScript code does not go between the canvas tags. The updated code is thus:

<script src="/libraries/RGraph.common.core.js"></script>
<script src="/libraries/RGraph.bar.js"></script>

<canvas id="myCanvas" height="385" width="900"></canvas>

<script>
    var bar = new RGraph.Bar({
        id: 'myCanvas',
        data: [4.5,3.5,3,4,3.5,2.5,2.5,3],
        options: {
            gutterLeft: 60,
            gutterRight: 25,
            gutterBottom: 60,
            gutterTop: 25,
            colors: ['blue'],
            textSize:16,
            labels: [
                "Avengers:InfinityWar",
                "\r\nDeadpool2",
                "BlackPanther",
                "\r\nPadmavat",
                "Sanju",
                "\r\nGotti",
                "Jurasic World:Fallen World",
                "\r\nRampage"
            ]
        }
    }).draw();
</script>

And, maybe, because of the style of configuration that you're using, I'm guessing that you may be using an older version of RGraph - and if you are you should download the latest copy here:

https://www.rgraph.net/download.html#stable