jquery 如何隐藏chart.js的标签

eoigrqb6 于 2022-11-03 发布在 jQuery

关注(0)|答案(4)|浏览(313)

我有一张图表，上面显示了3种类型标签

我想保留两张，隐藏一张发票收入表，怎么隐藏一张标签？我用的是chart.js v2

var myChart = new Chart(ctx, {
  type: 'bar',
  data: {
    labels: labels,
    datasets: [{
      label: 'Invoice Income Report',
      data: bar_chart_data,
      backgroundColor: colors,
      borderWidth: 1
    }, {
      label: 'Below Average',
      backgroundColor: ['rgba(255, 99, 132, 1)']
    }, {
      label: 'Above Average',
      backgroundColor: ['rgba(11, 156, 49, 1)']
    }]
  },
  options: {
    scales: {
      y: {
        beginAtZero: true
      }
    },
  }
});

jquery

来源：https://stackoverflow.com/questions/67968324/how-to-hide-label-for-chart-js

4条答案

按热度按时间

8fq7wneg1#

您只需将display设为false即可。

const options = {
    responsive: true,
    plugins: {
      legend: {
        position: 'top' as const,
        display: false,
      },
      title: {
        display: false,
        text: 'Chart.js Line Chart',
      },
    },
  };

赞(0）回复(0）举报 2022-11-03

zrfyljdw2#

在chart.js中，可以使用legend属性隐藏标签，在chart.js的options中添加如下代码

legend: {
    display: false
}

根据您的代码，添加图例后，选项将为.....

options: {
    scales: {
        y: {
            beginAtZero: true
        }
    },
    legend: {
        display: false
    }
}

赞(0）回复(0）举报 2022-11-03

5lhxktic3#

将图例选项添加到选项配置中，将显示设置为false：

, options: {
                    scales: {
                        y: {
                            beginAtZero: true
                        }
                    },
                    legend: {
                      display: false
                    }
                }

文件3：https://www.chartjs.org/docs/latest/configuration/legend.html文件2：https://www.chartjs.org/docs/2.6.0/configuration/legend.html

赞(0）回复(0）举报 2022-11-03

u3r8eeie4#

要隐藏chart.js版本3.9.1上的标签，请使用以下命令：

// Example chart.
const chart = new Chart(id, {
        type: 'bar', // Chart type.
        data: data, // Your data.

        options: {
            // Add plugins to options.
            plugins: {
                legend: {
                    display: true // This hides all text in the legend and also the labels.
                }
            }
            // add your scales or other options.
        }
    });

有关详细信息，请参阅以下文档：https://www.chartjs.org/docs/latest/configuration/legend.html

赞(0）回复(0）举报 2022-11-03

我来回答

jquery 如何隐藏chart.js的标签

4条答案

相关问题

热门标签

最新问答