DonutChart

Donut chart with optional tooltips, piece highlighting, and select and redraw callbacks

Live preview

Open in new tab ↗

Configuration:

  • tooltip {Boolean} enables tooltip (default: true)
  • format {String} a template (Tangular) for rendering tooltip (default: {{ value | format(0) }})
  • presentation {Boolean} enables presentation mode (default: true)
  • select {String} a path to method if a value is selected
  • redraw {String} a path to method if the chart is redrawn
  • animate {Boolean} enables/disables animations (default: false)
  • size {Number/String} width/height of donut (default: 0 = auto) or string is meant as a parent element
  • highlight {Boolean} enables/disables highlight of pieces (default: true)
  • margin {Number} adds a margin to size (default: 0)

More UI components

Browse all 348