comment changer l'arrière-plan dans chartjs et supprimer les lignes de fond?

Question

Comment changer la couleur d'arrière-plan, et enlever ces lignes, et comment cahnge un peu de tex,

par exemple: texte de point, quand vous passez la souris sur un point, vous obtenez le titre et la valeur de ceci.

mes js

function creating_chart(get_wrapper,type_of_chart, labels_of_chart, data_of_charts, title_of_chart){ 
       var ctx = document.getElementById(get_wrapper).getContext('2d'); 
       var myChart = new Chart(ctx, { 
        type: type_of_chart, 
        data: { 
         labels: labels_of_chart, 
         datasets: [{ 
          label: title_of_chart, 
          data: [2220, 19998, 55547, 55784, 999985], //data_of_charts 
          backgroundColor: [ 
           'rgba(47, 152, 208, 0.2)', 
          ], 
          borderColor: [ 
           'rgba(19, 247, 228,1)', 
          ], 
          borderWidth: 2, 
          pointBackgroundColor: 'rgba(19, 247, 228,1)', 
          pointBorderColor: 'rgba(19, 247, 228,1)', 
          pointBorderWidth: 5, 
         }] 
        }, 
        options: { 
         scales: { 
          yAxes: [{ 
           ticks: { 
            beginAtZero:true 
           } 
          }] 
         } 
        } 
       }); 
      }; 

Answer 1

changement de couleur fond

utilisation css pour définir la couleur d'arrière-plan pour la toile (graphique) élément:

canvas { 
    background-color: rgba(47, 152, 208, 0.1); 
} 

Retrait d'une grille de lignes

mis display propriété de quadrillages à false pour les deux axes x et y:

scales: { 
    xAxes: [{ 
     gridLines: { 
     display: false 
     } 
    }], 
    yAxes: [{ 
     gridLines: { 
     display: false 
     } 
    }] 
} 

texte de changement de bulle 's étiquette(ajouter le symbole $)

utiliser une fonction de rappel pour l'étiquette de infobulles, en tant que tel:

tooltips: { 
    callbacks: { 
     label: function(t, d) { 
     var xLabel = d.datasets[t.datasetIndex].label; 
     var yLabel = d.datasets[t.datasetIndex].data[t.index]; 
     return xLabel + ': $' + yLabel; 
     } 
    } 
} 

voir un working example.