Tuesday, 11 April 2017

Chartjs chart not rendering with pug template

I'm trying to use chartjs to render a chart in a pug template but for some reason it's not working, can anyone see what I'm doing wrong? The pug file loads just fine but there's no chart on it. Here's my pug template:

div(class="main container-fluid text-center")
div(class="choices")
    h2
    p I'm voting for:
    select(class="form-control")
        option 1
        option 2
        option 3
        option 4
        option 5
div(class="chart")        
canvas(id="chartPic" width="400" height="400")
script(src="chart.js")
script. 
    -var ctx = document.getElementById("chartPic"); 
       -var chart = new Chart(ctx,  {
            -type: 'pie',
            -data: {
                -labels: ["red", "green", "blue"],
                -datasets: [{
                    -label: 'Number of votes',
                    -data: [1, 1, 1],
                    -backgroundColor: [red, green, blue],
                    -borderColor: [green, blue, red],
                    -borderWidth: 1
                }],
                }
            -options: {
                -title: { 
                    -display: true,
                    -text: "chart",
                },
                -legend: {
                    -position: 'bottom'
                },
            }
        });



via Keli

No comments:

Post a Comment