安装Apexcharts
npm install --save apexcharts
npm install --save vue-apexcharts
安装之后,会在package.json的dependencies中找到这2个包文件:
配置vue-apexcharts
在main.js
文件中,导入Vue和vue-apexcharts,创建一个名为apexchart
的全局组件。
import Vue from 'vue'
import VueApexCharts from 'vue-apexcharts'
Vue.use(VueApexCharts)
Vue.component('apexchart', VueApexCharts)
在.vue文件中使用apexcharts
经过上面的步骤,即可在.vue文件中使用。下面以一个最简单的条形图示例:
1、新建如下alarm_calcul.vue文件:
<template>
<div>
<apexchart width="500" type="bar"