logo

/github|v4.6.1

Class

new RadialBarChart(props)

EXTENDS
  • Chart
PARAMETERS
NameTypeDescription

props

Object

PROPERTIES
NameTypeDescription

el

HTMLElement

The target element to create chart.

options

[ Object ]

Options for making RadialBar Chart.

PROPERTIES
NameTypeDescription

chart

[ Object ]

PROPERTIES
NameTypeDescription

title

[ stringObject ]

Chart title text or options.

animation

[ booleanObject ]

Whether to use animation and duration when rendering the initial chart.

width

[ numberstring ]

Chart width. 'auto' or if not write, the width of the parent container is followed. 'auto' or if not created, the width of the parent container is followed.

height

[ numberstring ]

Chart height. 'auto' or if not write, the width of the parent container is followed. 'auto' or if not created, the height of the parent container is followed.

series

[ Object ]

PROPERTIES
NameTypeDescription

selectable

boolean = false

Whether to make selectable series or not.

eventDetectType

[ string ]

Event detect type. 'grouped', 'point' is available.

dataLabels

[ Object ]

Set the visibility, location, and formatting of dataLabel. For specific information, refer to the DataLabels guide on github.

radiusRange

[ Array.<number>Array.<string> ]

Specifies the radius of the circle drawn. It is specified by entering a number or percent string value in start and end.

angleRange

[ Array ]

The range of angles to which the circle will be drawn. It is specified by putting number in start and end.

clockwise

[ boolean ]

Whether it will be drawn clockwise.

circularAxis

[ Object ]

PROPERTIES
NameTypeDescription

tick

[ Object ]

Option to adjust tick interval.

label

[ Object ]

Option to adjust label interval.

scale

[ Object ]

Option to adjust axis minimum, maximum, step size.

verticalAxis

[ Object ]

PROPERTIES
NameTypeDescription

tick

[ Object ]

Option to adjust tick interval.

label

[ Object ]

Option to adjust label interval.

legend

[ Object ]

PROPERTIES
NameTypeDescription

align

[ string ]

Legend align. 'top', 'bottom', 'right', 'left' is available.

showCheckbox

[ string ]

Whether to show checkbox.

visible

[ boolean ]

Whether to show legend.

width

[ number ]

Width of legend.

item

[ Object ]

and options of the legend item. For specific information, refer to the Legend guide on github.

exportMenu

[ Object ]

PROPERTIES
NameTypeDescription

visible

[ boolean ]

Whether to show export menu.

filename

[ string ]

File name applied when downloading.

tooltip

[ Object ]

PROPERTIES
NameTypeDescription

offsetX

[ number ]

Offset value to move title horizontally.

offsetY

[ number ]

Offset value to move title vertically.

formatter

[ Function ]

Function to format data value.

template

[ Function ]

Function to create custom template. For specific information, refer to the Tooltip guide on github.

responsive

[ Object ]

Rules for changing chart options. For specific information, refer to the Responsive guide on github.

PROPERTIES
NameTypeDescription

animation

[ booleanObject ]

Animation duration when the chart is modified.

rules

[ Array ]

Rules for the Chart to Respond.

lang

[ Object ]

Options for changing the text displayed on the chart or i18n languages.

PROPERTIES
NameTypeDescription

noData

[ Object ]

No Data Layer Text.

theme

[ Object ]

Chart theme options. For specific information, refer to the RadialBar Chart guide on github.

PROPERTIES
NameTypeDescription

chart

[ Object ]

Chart font theme.

noData

[ Object ]

No Data Layer Text theme.

series

[ Object ]

Series theme.

title

[ Object ]

Title theme.

circularAxis

[ Object ]

Circular Axis theme.

verticalAxis

[ Object ]

Vertical Axis theme.

legend

[ Object ]

Legend theme.

tooltip

[ Object ]

Tooltip theme.

exportMenu

[ Object ]

ExportMenu theme.

data

Object

Data for making RadialBar Chart.

PROPERTIES
NameTypeDescription

categories

[ Array ]

Categories.

series

Array.<Object>

Series data.

PROPERTIES
NameTypeDescription

name

string

Series name.

data

number

Series data.

Instance Methods

addSeries(data)

Add series.

PARAMETERS
NameTypeDescription

data

Object

Data to be added.

PROPERTIES
NameTypeDescription

name

string

Series name.

data

Array.<number>

Array of data to be added.

EXAMPLES
chart.addSeries({
  name: 'newSeries',
  data: [10, 20, 30, 40],
});

hideSeriesDataLabel()

Hide series data label.

EXAMPLES
chart.hideSeriesDataLabel();

hideTooltip()

Hide tooltip.

EXAMPLES
chart.hideTooltip();

setData(data)

Convert the chart data to new data.

PARAMETERS
NameTypeDescription

data

Object

Data to be set.

EXAMPLES
chart.setData({
  categories: ['1', '2', '3'],
  series: [
    {
      name: 'new series',
      data: [1, 2, 3],
    },
    {
      name: 'new series2',
      data: [4, 5, 6],
    }
  ]
});

setOptions(options)

Convert the chart options to new options.

PARAMETERS
NameTypeDescription

options

Object

Chart options.

EXAMPLES
chart.setOptions({
  chart: {
    width: 500,
    height: 500,
    title: 'Olympic Medals',
  },
  series: {
    selectable: true
  }
});

showSeriesDataLabel()

Show series data label.

EXAMPLES
chart.showSeriesDataLabel();

showTooltip(seriesInfo)

Show tooltip.

PARAMETERS
NameTypeDescription

seriesInfo

Object

Information of the series for the tooltip to be displayed.

PROPERTIES
NameTypeDescription

index

number

Index of data within series. If 'series.eventDetectType' is "grouped", only index is needed.

seriesIndex

[ number ]

Index of series

EXAMPLES
// eventDetectType is 'grouped'
chart.showTooltip({index: 1});

// eventDetectType is 'point'
chart.showTooltip({index: 1, seriesIndex: 2});

updateOptions(options)

Update chart options.

PARAMETERS
NameTypeDescription

options

Object

Chart options.

EXAMPLES
chart.updateOptions({
  chart: {
    title: 'Olympic Medals',
  },
  series: {
    eventDetectType: 'grouped'
  }
});
Resizable