数据可视化(三)

本文介绍如何使用JavaScript库SheetJS将Excel数据导入并直接映射到图表,通过解析Excel的sheet数据,利用XLSX.utils.sheet_to_json方法转换为JSON,进而渲染到图表。提供了实现过程和代码示例,读者可以通过拖放或文件选择实现Excel数据的图表展示。
摘要由CSDN通过智能技术生成

🌜 由于我们平时用的最多的数据整理方式就是借助Excel来操作数据,所以,我在想一个问题:能不能把Excel中的数据直接进行到图表的映射呢?答案当然是可以的,折腾了大半天终于有了结果:

image-20200823172243110

🌩 你所看到的正是从Excel的三个sheet中导出的数据,然后将数据渲染到图表。实现思路如下:

  • 从浏览器界面导入Excel
  • 解析Excel中每个sheet数据
  • 将数据渲染到图表

从浏览器界面导入Excel并解析对于原生的js是不支持的,需要借助第三方的js库来实现,目前,能且只能找到一个相关的开源库:https://github.com/SheetJS/sheetjs 。CDN引入:

<script src="https://cdn.bootcdn.net/ajax/libs/xlsx/0.16.6/xlsx.full.min.js"
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

那个小白猿

讨杯可乐

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值