Excel表格数据生成ECharts图表

什么东西:

是这样,前些时候有个网友问我,ECharts怎么用,我说我研究研究。。。

然后就做了这么个小东西,通过html页面,选择一个有数据(固定格式)的Excel文件,根据Excel里面的数据,生成对应的ECharts图表,如折线图、柱状图。

效果如下:

其实大家仔细一看就知道Excel的数据和转换后的图表是怎么对应上的。例如:

文件名 -- 图名

首列名 -- x轴名

首列数据 -- x轴刻度

其他列名 -- 一个统计项目

其他数据 -- 数据内容

 

实现方式:

代码方面是比较简单的,读取和转换Excel数据用了GitHub的js-xlsx:https://github.com/SheetJS/js-xlsx,图表部分用的是ECharts的库https://echarts.baidu.com/

然后就是,通过选择Excel文件,读取数据,转换成ECharts要的数据格式,然后调用ECharts的功能展现出图表。

 

全部给你:

有兴趣的可以下载来玩玩,我直接上传到csdn了,可通过:根据Excel表格数据生成ECharts图表进去下载,不过这里要5积分,我也不知道怎么才能设置成免费。

没积分的话留个联系方式或者邮箱什么的我直接给你发。

压缩包里面直接打开index.html就行了,然后在页面点按钮选择Excel文件,就会自动读取并生成图表。

压缩包里面有个Excel模板的文件夹,里面有两个我测试用的Excel,你们也可以参考着玩。

写得比较简单,bug还是不少的,自己也可以看着修改着玩。

 

最后:

小仙女考试顺利~

我也考试顺利~

 

-------------2019年7月1日更新--begin----------------------------------------------------------------------

是酱紫吼,上周的时候有个小伙伴说想要个饼图的,所以翻出了老代码,一番折腾,加了个饼图的按钮。

效果如下,注意Excel与饼图的数据对应关系 :

然后,新的整个项目已经传到csdn了,有需要的话可以下载,或者留言邮箱。

资源:根据Excel表格数据生成ECharts图表 V2.3

-------------2019年7月1日更新--end!----------------------------------------------------------------------

-------------20210408更新,项目上传到github了,内容无更新,有需要可以直接取github下载-------------

https://github.com/itlihy/ExcelToECharts

  • 44
    点赞
  • 101
    收藏
    觉得还不错? 一键收藏
  • 388
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 388
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值