Skip to content
ECharts

Bar Chart

Category bar chart with axis tooltip and styled bars.

#echarts#bar

Code

echarts
const chart = echarts.init(document.getElementById('chart'));
chart.setOption({
  title: { text: 'Monthly Sales', left: 'center' },
  tooltip: { trigger: 'axis' },
  xAxis: {
    type: 'category',
    data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']
  },
  yAxis: { type: 'value', name: 'k$' },
  series: [{
    name: 'Sales',
    type: 'bar',
    data: [120, 200, 150, 80, 70, 110],
    itemStyle: { color: '#5470c6', borderRadius: [4, 4, 0, 0] },
    barWidth: '60%',
    label: { show: true, position: 'top' }
  }]
});