[Chartjs]-Create two inline chart using chart js

by

2👍

Your script tags seem to be duplicated, I’m not sure if this is intentional but you’re overshadowing any functions and vars declared in the first script tag with the second script tag.

Regardless, the problem here is that you’re loading two charts with same ID on one canvas.

Set the name of your second chart to myChart2 and add another canvas with myChart2 as ID:

new Chart("myChart", {
...

new Chart("myChart2", {
...

and for the canvas:

<canvas id="myChart" width="90" height="90" style="width:100%;max-width:650px"></canvas>
<canvas id="myChart2" width="90" height="90" style="width:100%;max-width:650px"></canvas>

That should load both charts and inline can be accomplished through css using flexbox or inline-block display.

Leave a comment