vue使用ECHarts并封装

1. npm安装echarts npm install echarts -S , 也可以 选择需要的模块，在线定制下载
2. 在 assets 中创建echarts文件夹放echarts-plug.js

开始封装
—————————————————————————————————————————————
echarts-plug.js

import echarts from "echarts";

let echarts = {
    
    
	// 折线图
	line:function(id){
    
    
		var myChart = echarts.init(document.getElementById(id));
		var option = {
    
    
			// 折线图options配置
		};
		
		myChart.clear();
		myChart.setOption(option, true);
	},
	// 柱状图
	column:function(id){
    
    
		var myChart = echarts.init(document.getElementById(id));
		var option = {
    
    
			// 柱状图options配置
		};
		
		myChart.clear();
		myChart.setOption(option, true);
	},
}

export default echarts;

开始使用
—————————————————————————————————————————————
demo.vue

<template>
	<!-- 这个div需要有固定的宽高，否则无效 -->
	<div id="line"></div> 
</template>

import echarts from '@/assets/js/echarts/echarts-plug.js'; // 路径改成自己的

mounted() {
    
    
	echarts.line('line') // 初始化折线图
},

简单封装，有问题欢迎评论区讨论