2016-05-12 8 views
7

Sto cercando di passare al colore di sfondo della mia griglia in chart.js, ho provato a seguire la documentazione e ho fatto molte ricerche ma posso sembra che capisca. Voglio anche sbarazzarmi dell'etichetta superiore, non riesco a trovare un modo semplice per farlo. L'etichetta di cui sto parlando è l'etichetta che dice "Il mio primo set di dati" sul demo qui: http://www.chartjs.org/docs/#bar-chartGrafico a barre Chart.js: Colore griglia e etichetta Nascondi

Soluzione:

<canvas id="myChart"></canvas> 
<script> 
    var ctx = document.getElementById("myChart"); 

    var myChart = new Chart(ctx, { 
    type: 'bar', 
    data: { 
     labels: ["Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag", "Zondag"], 
    datasets: [{ 
    label: "", 
    data: [12, 19, 3, 5, 2, 3, 4], 
    backgroundColor: "rgba(3, 118, 195, 0.5)", 
    borderColor: "rgba(0, 158, 219, 1)", 
    borderWidth: "2", 
    }] 
}, 
options: { 
    legend:{ 
     display: false 
    }, 
    scales: { 
    xAxes: [{ 
     gridLines: { 
      show: true, 
      color: "F3F3F3", 
     } 
    }], 
    yAxes: [{ 
     ticks: { 
     beginAtZero: true 
     } 
    }] 
    }, 

} 
    }); 

</script> 

Grazie!

risposta

8

Per nascondere etichetta cioè nient'altro che leggenda: Usa sotto config nella options:

legend:{ 
     display:false 
} 

Così nel codice:

options: { 
    legend:{ 
      display:false 
    }, 
    scales: { 
     yAxes: [{ 
      ticks: { 
      beginAtZero: true 
      } 
     }] 
     } 
    } 

E, per uso di sfondo colore CSS per l'elemento canvas:

<canvas id="myChart" style="background-color: grey;"> 

Spero che questo faccia per te!

+0

Grazie! ho rimosso la leggenda con quel codice! – paradizzee

+0

Ma stavo cercando di ricolorare la griglia, quindi le linee sullo sfondo hanno qualche idea su come funziona? Grazie! – paradizzee

+0

Per sfondo linea di griglia colore: scale: { xAxes: [{ griglie: { mostra: vero, colore: "rosso", } }] } Analogamente per l'asse Y – Krishnakant