A chartistjs plugin that makes the curved labels on donut charts
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
data initial commit Aug 9, 2017
.gitignore Initial commit Aug 9, 2017
LICENSE Initial commit Aug 9, 2017
README.md Update README.md Aug 9, 2017
chartist-plugin-curveddonutlables.js initial commit Aug 9, 2017
index.html initial commit Aug 9, 2017
styles.css initial commit Aug 9, 2017

README.md

Curved labels plugin for Chartist.js

This is a chartist-js (https://gionkunz.github.io/chartist-js/index.html) javascript plugin that converts horizontal labels to curved labels on donut charts.

Labels are placed horizontally by default. This plugin will orient the labels inside each donut "slice" and curve the labels, following the curve of the donut.

To use, simply include this plugin in your list plugins in the option object you pass into the chartist chart you create. It looks for Pie charts with donut = true, so will only work with those types.

var defaultOptions = {
  textAnchor: "middle",
  align: "center"
}

Example to create a chart with curved labels

var curvedOptions = {
        donut: true,
        donutWidth: 45,
        donutSolid: true,
        startAngle: 0,
        showLabel: true,
        width: 400,
        height: 400, 
        plugins: [            
          Chartist.plugins.curvedDonutLabels(),                                
        ]          
      };  

      new Chartist.Pie("#donutCurvedLabels", donutData, curvedOptions);