vue可视化如何把两个encharts图放在一个页面

您可以使用 Vue 的组件化机制来实现在同一个页面上放置多个 Echarts 图表。具体步骤如下：

1. 在 Vue 组件中引入 Echarts 库：

import echarts from 'echarts'

2. 在 Vue 组件中定义两个 Echarts 图表的容器：

<template>
  <div>
    <div ref="chart1" style="width: 600px; height: 400px;"></div>
    <div ref="chart2" style="width: 600px; height: 400px;"></div>
  </div>
</template>

3. 在 Vue 组件的 mounted 生命周期钩子函数中，分别初始化两个 Echarts 图表：

mounted() {
  // 初始化第一个 Echarts 图表
  const chart1 = echarts.init(this.$refs.chart1)
  chart1.setOption({...})

  // 初始化第二个 Echarts 图表
  const chart2 = echarts.init(this.$refs.chart2)
  chart2.setOption({...})
}

4. 在 Vue 组件的 destroyed 生命周期钩子函数中，销毁两个 Echarts 图表：

destroyed() {
  // 销毁第一个 Echarts 图表
  const chart1 = echarts.getInstanceByDom(this.$refs.chart1)
  chart1.dispose()

  // 销毁第二个 Echarts 图表
  const chart2 = echarts.getInstanceByDom(this.$refs.chart2)
  chart2.dispose()
}

这样就可以在同一个页面上放置多个 Echarts 图表了。