chartjs-plugin-labels icon indicating copy to clipboard operation
chartjs-plugin-labels copied to clipboard

Disable showing percentage or value on certain chart with react-chartjs-2

Open JaosnHsieh opened this issue 6 years ago • 1 comments

It took me some time to turn off showing text on certain chart with react-chartjs-2.

I finally made it work by

import React from "react";
import { Pie } from "react-chartjs-2";

const data = {
  labels: ["Red", "Green", "Yellow"],
  datasets: [
    {
      data: [300, 50, 100],
      backgroundColor: ["#FF6384", "#36A2EB", "#FFCE56"],
      hoverBackgroundColor: ["#FF6384", "#36A2EB", "#FFCE56"]
    }
  ]
};

export default () => (
  <Pie
    data={data}
    options={{
      plugins: {
        labels: {
          render: () => {}
        }
      }
    }}
  />
);

working example: https://codesandbox.io/s/v0qz6r7py0

JaosnHsieh avatar Oct 18 '18 09:10 JaosnHsieh

Please refer to https://www.chartjs.org/docs/latest/developers/plugins.html#disable-plugins

plugins: {
  labels: false
}

emn178 avatar Oct 30 '18 15:10 emn178