Chart.js ignorando altezza tela e larghezza

Question

A seguito della Chart.js documentation sto cercando di disegnare un piccolo grafico:

<canvas id="myChart" width="400" height="400"></canvas> 
<script> 
var ctx = document.getElementById("myChart"); 
var myChart = new Chart(ctx, { 
    type: 'line', 
    data: { 
    labels:['15-2016','16-2016','17-2016',], 
    datasets:[ 
     { 
     label:'Yes', 
     data:[3.4884,1.1628,1.3514,], 
     backgroundColor:'rgba(75,192,192,1)', 
     borderColor:'rgba(75,192,192,1)', 
     pointRadius:0 
     }, 
     { 
     label:'Maybe', 
     data:[0.5571,1.3298,0.791,], 
     backgroundColor:'rgba(255,206,86,1)', 
     borderColor:'rgba(255,206,86,1)', 
     pointRadius:0 
     }, 
     { 
     label:'No', 
     data:[0,0,0,], 
     backgroundColor:'rgba(255,99,132,1)', 
     borderColor:'rgba(255,99,132,1)', 
     pointRadius:0 
     } 
    ] 
    }   
}); 
</script> 

Tuttavia, quando la pagina viene visualizzata la tela diventa in qualche modo

<canvas style="height: 929px; width: 929px;" id="myChart" width="1858" height="1858"></canvas> 

che è waaaaay troppo grande per i miei bisogni. Come posso impostare la larghezza e l'altezza della tela come ciò che voglio?

Answer 1

ho potuto codificare la dimensione del grafico spegnendo reattività:

options: { 
    responsive: false 
} 

Answer 2

ho risolto il problema aggiungendo "maintainAspectRatio: false" alle opzioni.

options : { 
    maintainAspectRatio: false 
}; 

Answer 3

utilizzando entrambe le opzioni, maintainAspectRatio: falsi e reattivo: true sembrano fare il trucco di rendere il grafico in forma la tela come dimensioni in altezza tela e tag di larghezza.