echarts添加el-radio-button

echarts 是一款非常流行的数据可视化工具，可以用来快速绘制各种图表。在 echarts 中添加 el-radio-button 可以用来实现图表中的单选按钮，具体操作步骤如下：

1. 安装 echarts 和 element-ui

在项目中安装 echarts 和 element-ui，可以通过以下命令进行安装：

npm install echarts --save
npm install element-ui --save

2. 引入 echarts 和 element-ui

在需要使用 echarts 的页面中引入 echarts 和 element-ui：

import echarts from 'echarts'
import { RadioGroup, RadioButton } from 'element-ui'
Vue.use(RadioGroup)
Vue.use(RadioButton)

3. 在图表中添加 el-radio-button

在图表的 option 中添加一个包含 el-radio-button 的组件：

{
  title: {
    text: '柱状图示例'
  },
  tooltip: {},
  legend: {
    data:['销量']
  },
  xAxis: {
    data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
  },
  yAxis: {},
  series: [{
    name: '销量',
    type: 'bar',
    data: [5, 20, 36, 10, 10, 20]
  }],
  toolbox: {
    feature: {
      dataView: {show: true, readOnly: false},
      magicType: {show: true, type: ['line', 'bar']},
      restore: {show: true},
      saveAsImage: {show: true}
    }
  },
  // 添加 el-radio-button 组件
  graphic: {
    type: 'group',
    left: 'center',
    top: 'bottom',
    children: [
      {
        type: 'radioButtonGroup',
        id: 'bar-radio-group',
        left: 0,
        top: 0,
        children: [
          {
            type: 'radioButton',
            id: 'bar-radio-1',
            value: 'bar',
            text: '柱状图',
            textStyle: {
              fontSize: 12
            },
            width: 70,
            height: 20,
            borderColor: '#000',
            backgroundColor: '#fff'
          },
          {
            type: 'radioButton',
            id: 'bar-radio-2',
            value: 'line',
            text: '折线图',
            textStyle: {
              fontSize: 12
            },
            width: 70,
            height: 20,
            borderColor: '#000',
            backgroundColor: '#fff'
          }
        ],
        onChange(idx) {
          if (idx === 0) {
            chart.setOption({
              series: [{
                name: '销量',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20]
              }]
            })
          } else if (idx === 1) {
            chart.setOption({
              series: [{
                name: '销量',
                type: 'line',
                data: [5, 20, 36, 10, 10, 20]
              }]
            })
          }
        }
      }
    ]
  }
}

4. 相关问题：

1. 如何在 echarts 中添加其他 element-ui 组件？
2. 如何使用 echarts 绘制折线图？
3. 如何使用 echarts 绘制饼图？