Question

我试图在chart.js中更改为网格的背景颜色，我已尝试按照文档进行操作，但我做了大量研究，但我似乎无法理解弄明白。我也想摆脱顶级品牌，无法找到一种简单的方法。我正在谈论的标签是标有＆＃34;我的第一个数据集＆＃34;在这里的演示：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 element：

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

希望这会为你做到！

Chart.js条形图：网格颜色和隐藏标签

1 个答案: