Skip to content
ECharts

Radar Chart

Radar with multiple indicators and overlaid value series.

#echarts#radar

Code

echarts
const chart = echarts.init(document.getElementById('chart'));
chart.setOption({
  tooltip: {},
  legend: { data: ['Budget', 'Actual'] },
  radar: {
    indicator: [
      { name: 'Sales', max: 6500 },
      { name: 'Admin', max: 16000 },
      { name: 'IT', max: 30000 },
      { name: 'Support', max: 38000 },
      { name: 'Dev', max: 52000 },
      { name: 'Marketing', max: 25000 }
    ],
    radius: '65%',
    splitArea: { areaStyle: { color: ['#fafafa', '#eee'] } }
  },
  series: [{
    type: 'radar',
    data: [
      { value: [4200, 16000, 28000, 35000, 50000, 19000], name: 'Budget' },
      { value: [5000, 14000, 28000, 31000, 42000, 21000], name: 'Actual' }
    ],
    areaStyle: { opacity: 0.2 }
  }]
});