在图表 js 中隐藏标签的问题（angular 的 ng2 图表）

Question

我想隐藏图表上 x 轴中的标签，因为我需要设置勾号 display:false，但是当我这样做时，0 线也消失了。我需要设置标签以使其出现在工具提示标题中。我认为只是将标签的颜色设置为透明，但我认为这不是最好的方法 xD

public optionsbar: (ChartOptions) ={

responsive: false,

tooltips:{
titleFontSize:0,
bodyFontSize:10,
bodySpacing:50
},

  scales: {
    yAxes: [{
      ticks: {
        display: false,
  },
  gridLines: {
    color: '#949494',
    drawTicks: false,
    display:true,
    zeroLineColor: '#949494',
    drawBorder:true
  }
}],
xAxes: [{
  ticks: {
    beginAtZero:true,
    display: false,
    },
   gridLines: {
    color: '#949494',
    drawTicks: false,
    display:true,
    zeroLineColor: '#949494',
    drawBorder:true
   }
  }]
}
}

Answer 1

我觉得你的代码没问题，它应该能按预期工作。似乎绘制了基线，但它不适合 canvas.

这个问题可以通过将xAxis.gridlines.drawTicks: false替换为xAxis.gridlines.tickMarkLength: 1来解决，如下所示。

xAxes: [{
  ticks: {
    display: false,
  },
  gridLines: {
    color: '#949494',
    // drawTicks: false,
    tickMarkLength: 1,
    zeroLineColor: '#949494',
  }
}]

另一种选择是在图表底部定义一些 padding，如下所示：

options: {
  layout: {
    padding: {
      bottom: 1
    }
  },
  ...

在图表 js 中隐藏标签的问题（angular 的 ng2 图表）

problem hidding the label in chartjs (ng2chart for angular)

angular

typescript

chart.js

ng2-charts