Come risolvere il problema del grafico sfocato nel grafico js?

Question

Sto creando un grafico a barre usando chart.js. ma questo grafico appare sfocato nel mio schermo. Qui di seguito è il mio codice HTML e js:

<canvas id="myChart" style="padding-left: 0;padding-right: 0;margin-left: auto; margin-right: auto; display: block;width: 90%;height:350px;"></canvas> 

Js codice per creare bar chart:

window.onload = function() {  
var data = { 
labels: [], 
datasets: [ 
    { 
     label: "My First dataset", 
     fillColor: "rgba(220,220,220,2)", 
     strokeColor: "rgba(220,220,220,2)", 
     pointColor: "rgba(220,220,220,2)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(220,220,220,2)" 
    }, 
    { 
     label: "My Second dataset", 
     fillColor: "rgba(12, 18, 51, 1)", 
     strokeColor: "rgba(12, 18, 51, 1)", 
     pointColor: "rgba(12, 18, 51, 1)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(12, 18, 51, 1)" 
    } 
] 
}; 

var ctx = jQuery("#myChart")[0].getContext('2d'); 
var options = { 
scaleBeginAtZero : true, 
scaleShowGridLines : true,  
scaleGridLineColor : "rgba(0,0,0,.05)", 
scaleGridLineWidth : 1,  
scaleShowHorizontalLines: true, 
scaleShowVerticalLines: false, 
barShowStroke : true, 
barStrokeWidth : 2, 
barValueSpacing : 10,  
barDatasetSpacing : 1, 

legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>" 

} 
var myLineChart = new Chart(ctx).Bar(data, options); 
<?php foreach($resultGraph as $share){?> 

myLineChart.addData([<?php echo $share->shCOunt;?>, <?php echo $share->tt;?>], "<?php echo $share->post_date1;?>"); 
<?php } ?> 

//myLineChart.addData([30, 50], "January"); 

} 

</script> 

Answer 1

prova ad aggiungere 0,5 al vostro x valori delle coordinate. Vedi spiegazione a questo here

Answer 2

Ho affrontato questo oggi su ultima versione di Chrome, letteralmente sprecato 3 ore per inseguirlo. Infine si è scoperto che il problema si verifica solo quando l'URL del browser è localhost con qualche porta. per esempio. http://localhost:1700/

Ho sfogliato la mia app su un host fittizio come http://www.localdomain.com/(by modificando il file hosts) e il problema è scomparso. :-)

Spero che questa informazione aiuti gli sviluppatori a riprodurre e correggere l'errore !!!