you can also put the code below at the end of chart script and then hide your legend in your chartjs options. this creates a ul element in the div that you can manipulate with css using the class and/or the id for greater control.

        <div id="js-legend" class="chart-legend"></div>

        /*-- your chartjs code here --*/

        document.getelementbyid('js-legend').innerhtml = barchart.generatelegend();



check the chart.js docs, there is no options like titlealign, see: it should be in the future, there is an pull request for that: .

there is an option to do that, you should not display chart title and add your own. here is example how i've done that

<div class="panel panel-default">
    <div class="panel-heading">
        <h5>{{ title }}</h5>
    <div class="panel-body">
         <canvas id="my-chart" width="150" height="150"></canvas>

Related Query

More Query from same tag