首页 > 解决方案 > 显示零线按条隐藏

问题描述

我已经分配了一个任务来创建这种类型的条形图,如图所示 [![在此处输入图像描述][1]][1] 我用红色圆圈标记了它有以下不同颜色的标签和图例我我面临一个问题我已经创建了四个数据集,一个用于圆形第二个是我的条形颜色 3 和 4 用于图例和标签我的条形是灰色的,它给我灰色的图例,第二个数据集给我未定义这是我的输出 [![在此处输入图像描述][2]][2] 这是我的代码

datasets = [
    {
      type: 'scatter',
      data: [0, 0, 0, 0, 0, 0, 0],
      backgroundColor: 'rgb(0, 0, 255)',
      borderColor: 'rgb(255, 255, 255)',
      pointRadius: 7,
      pointHoverRadius: 7,
      borderWidth: 2,
    },
    {
      label: '',
      data: verticalData,
      backgroundColor: '#eeeff7',
      barPercentage: 0.5,
    },

    {
      label: 'Food variance',
      backgroundColor: '#eeeff7',
    },
    {
      label: 'LV',
      backgroundColor: ['#dd00e5'],
    },
    {
      label: 'L + v',
      backgroundColor: ['#00d0cc'],
    },
  ]
options:{
    tooltips: {
      backgroundColor: '#4946D2',
    },
    // responsive: true,
    maintainAspectRatio: false,
    scales: {
      yAxes: [
        {
          ticks: {
            beginAtZero: true,
            maxBarThickness: 20,
            callback: (value) => callBack(value),
          },

          gridLines: {
            borderDash: [8, 9],
          },
        },
      ],
      xAxes: [
        {
          ticks: {
            fontSize: 12,
          },

          gridLines: {
            zeroLineColor: 'white',
            display: false,
          },
        },
      ],
    },
    legend: {
      position: 'top',
      align: 'end',
      display: display,

      labels: {
        fontSize: 10,
        fontColor: 'grey',
        usePointStyle: true,
      },
    },
  }

我也面临宽度问题边框半径栏顶部我该如何解决这两个[1] : https ://i.stack.imgur.com/oR9D4.png [2]:https://i.stack.imgur .com/8g9Eh.png

标签: charts

解决方案


推荐阅读