echarts使用同一张图点击类型为el-radio-button的按钮切换不同后端数据

要实现在同一张 ECharts 图上点击 el-radio-button 类型的按钮切换不同的后端数据，您可以使用 Element UI 的 radio-button 组件来创建按钮，并在按钮的 change 事件中发起 Ajax 请求来获取后端数据，然后更新图表数据。具体的步骤如下：

1. 创建一个包含所有需要切换的数据的数组。

2. 在 ECharts 的 option 中设置一个初始数据，用于图表的初始化。

3. 使用 Element UI 的 radio-button 组件来创建按钮，并绑定 change 事件。

4. 在 change 事件中，使用 Ajax 请求来获取对应的后端数据。

5. 在请求成功后，使用 ECharts 的 setOption() 方法来更新图表数据，将获取到的数据传入 setOption() 方法中即可。

6. 每次点击按钮时，都需要重新发起 Ajax 请求，并在请求成功后调用 setOption() 方法来更新图表数据。

以下是一个示例代码：

<template>
  <div>
    <el-radio-group v-model="currentData">
      <el-radio-button v-for="(data, index) in dataArr" :key="index" :label="data.name">
        {{ data.name }}
      </el-radio-button>
    </el-radio-group>
    <div ref="chart" style="height: 400px;"></div>
  </div>
</template>

<script>
import echarts from 'echarts';
import axios from 'axios';

export default {
  data() {
    return {
      dataArr: [
        {name: 'data1', url: '/api/data1'},
        {name: 'data2', url: '/api/data2'}
      ],
      currentData: 'data1',
      chart: null,
      option: {
        // 设置初始数据
        series: [{
          name: 'data1',
          data: []
        }],
        // 其他配置
        ...
      }
    };
  },
  mounted() {
    // 初始化图表
    this.chart = echarts.init(this.$refs.chart);
    this.chart.setOption(this.option);
    // 第一次加载数据
    this.loadData();
  },
  methods: {
    loadData() {
      // 获取当前选中的数据
      var data = this.dataArr.find(d => d.name === this.currentData);
      // 发起 Ajax 请求
      axios.get(data.url).then(res => {
        // 更新图表数据
        this.chart.setOption({
          series: [{
            name: data.name,
            data: res.data
          }]
        });
      });
    }
  },
  watch: {
    currentData(val) {
      // 监听数据选项的变化，重新加载数据
      this.loadData();
    }
  }
}
</script>

在这个示例中，我们使用了 Vue CLI 创建了一个 Vue 组件，并使用了 Element UI 的 radio-button 组件来创建按钮。在组件的 data 中，我们定义了一个包含两个数据对象的数组 dataArr，其中每个对象都包含了数据名称和后端数据 URL。然后在 ECharts 的 option 中设置了一个初始数据（dataArr[0]），并使用了 mounted 钩子来初始化图表和加载初始数据。在组件的 methods 中，我们定义了一个 loadData 方法，用于根据当前选中的数据来加载对应的后端数据，并更新图表数据。在组件的 watch 中，我们监听了数据选项的变化，每次选项变化时都会重新加载对应的后端数据。