（新手）关于echarts图形导出到excel

最新推荐文章于 2025-07-11 15:06:06 发布

原创

最新推荐文章于 2025-07-11 15:06:06 发布 · 1.8w 阅读

29 ·

CC 4.0 BY-SA版权

文章标签：

#echarts #base64 #编码 #图形 #excel

一、情景：本人刚接触echarts不久，之前有一个小功能需要实现：将echarts生成的图形导出到excel中，百度了好久。由于本人是新手，所有百度上的获取图形的base64编码的有些方法是没有理解，同事有个大神写了一个js，各种方法获取编码，然后用使用虚拟表单提交，直接一脸懵逼，耽误好长时间才解决。后来为了完成任务，直接套用这个大神的方法，根本不理解。后来回头研究了一下，这里总结一下自己的实现过程，希望会是更加简单易懂。（注：使用的是echarts2.0，由于3.0差别有点大，不知道是否合适）

二、echarts代码：获取echarts图片的base64编码

var imagesBase64="";
function lineCharts(data){
	//将Echarts初始化到div中
	var eChart = echarts.init(document.getElementById('roadLevel01'));
	//设置options
	options = {
			title : {
				text : '问题道路里程柱图展示',
				x : 'center',
				y : 20
			},
			 animation: false,//关闭动画效果，避免导出的图形不完整
			tooltip : {
				trigger : 'axis'
			},
			legend : {
				data : [ '问题道路里程' ],
				x : 40,
				y : 45,
				textStyle : {
					fontSize : 8,
				},
				orient : 'vertical'
			},
			grid : {
				x : '20%',
				y : '24%',

				width : "70%",
				height : '60%',
				containLabel : true
			},
			calculable : false,
			xAxis : [ {
				type : 'category',
				axisLine : {
					onZero : f