Chart.js條形圖：網格顏色和隱藏標簽

Question

我正在嘗試在chart.js中更改我的網格的背景顏色，我已經嘗試按照文檔進行了很多研究，但我似乎無法弄明白。 我也想擺脫頂級品牌，也找不到一個簡單的方法。 我正在談論的標簽是在這里演示的“我的第一個數據集”的標簽： http ： //www.chartjs.org/docs/#bar-chart

解：

<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>

謝謝！

Answer 1

隱藏標簽，即只有傳說：在options使用以下配置：

legend:{
       display:false
}

因此在你的代碼中：

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

並且，對於背景顏色，使用css for canvas元素：

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

希望這能為你做到！