VUE柱形图双纵坐标轴

在Vue中创建一个柱形图，并使用双纵坐标轴，你可以使用ECharts库来实现。下面是一个简单的示例代码：

首先，你需要安装ECharts库。在命令行中运行以下命令：

npm install echarts

然后，在Vue组件中，可以按照以下方式引入ECharts和相关样式：

import echarts from 'echarts'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/title'
import 'echarts/lib/component/legend'

接下来，在Vue的`mounted`钩子函数中，创建一个包含柱形图和双纵坐标轴的配置对象，并将其渲染到DOM元素中：

mounted() {
  const chart = echarts.init(document.getElementById('chart-container'))

  const option = {
    title: {
      text: '柱形图双纵坐标轴示例'
    },
    tooltip: {},
    legend: {
      data: ['系列一', '系列二']
    },
    xAxis: {
      data: ['数据1', '数据2', '数据3', '数据4', '数据5']
    },
    yAxis: [
      {
        type: 'value',
        name: '系列一',
        min: 0,
        max: 100,
        position: 'left',
        axisLabel: {
          formatter: '{value} %'
        }
      },
      {
        type: 'value',
        name: '系列二',
        min: 0,
        max: 200,
        position: 'right',
        axisLabel: {
          formatter: '{value} 个'
        }
      }
    ],
    series: [
      {
        name: '系列一',
        type: 'bar',
        data: [30, 20, 50, 80, 90]
      },
      {
        name: '系列二',
        type: 'bar',
        yAxisIndex: 1,
        data: [100, 150, 120, 70, 50]
      }
    ]
  }

  chart.setOption(option)
}

最后，在Vue模板中添加一个具有唯一id的DOM元素，用于渲染图表：

<template>
  <div id="chart-container"></div>
</template>

这样就创建了一个包含柱形图和双纵坐标轴的Vue组件。你可以根据需要修改配置对象中的数据和样式来适应你的需求。