Skip to content

Latest commit

 

History

3 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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);

About

A chartistjs plugin that makes the curved labels on donut charts

Resources

Stars

1 star

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages