chartsjs-plugin-data-labels

Plugin for ChartJS to draw labels on charts

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
chartsjs-plugin-data-labels
710.1.56 years ago6 years agoMinified + gzip package size for chartsjs-plugin-data-labels in KB

Readme

npm
chartsjs-plugin-data-labels
Plugin for ChartJS to draw labels on charts

Installation

You can download the latest version of Plugin for ChartJS to draw labels on charts from the GitHub releases
To install via npm:
npm i chartsjs-plugin-data-labels

Configuration

To configure this plugin, you can simply add the following entries to your chart options:
| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | display | Boolean | true | true to enable this graph, else false to disable it for the associated graph. | fontSize | Number | Chart.defaults.global.defaultFontSize | | fontStyle | String | Chart.defaults.global.defaultFontStyle | | fontFamily | String | Chart.defaults.global.defaultFontFamily | | color | String | Chart.defaults.global.defaultFontColor | One color for all labels. | colors | Array | [] | It takes a set of values for each labels. If not specified, the default color. | minRadius | Number | 35 | The minimum radius, in pixels, in which even the labels are displayed (for pie charts).
For example:
datasets: [
  {
    dataLabels: {           //  disabled by default
        colors: ['#fff', '#ccc', '#000'], //  Array colors for each labels
        minRadius: 30, //  minimum radius for display labels (on pie charts)
    }
  }
]
Please see JSBin: https://jsbin.com/joponil/4/edit