[echarts]数据视图导出excel(纯前端)

最新推荐文章于 2023-11-20 14:12:42 发布

ZhiMaHuyizhi

最新推荐文章于 2023-11-20 14:12:42 发布

阅读量1.6k

点赞数 1

文章标签： echarts javascript 前端

本文链接：https://blog.csdn.net/ZhiMaHuyizhi/article/details/123117269

版权

本文介绍了如何通过前端技术实现在Echarts中数据视图的Excel导出功能。主要方法是利用jquery.table2excel.js库，首先重写toolbox-feature-dataView-lang的optionToContent方法，将数据视图展示为表格，然后修改contentToOption方法，添加导出Excel的功能。

摘要由CSDN通过智能技术生成

核心思路：

利用 jquery.table2excel.js 包的table2excel()方法实现echarts数据视图的导出

1、重写toolbox-feature-dataView-lang的optionToContent()方法，使数据视图显示表格

2、重写toolbox-feature-dataView-lang的contentToOption方法，借助jquery.table2excel.js给按钮添加导出excel功能

附源码：

toolbox: {
feature: {
dataView: {
    show: true,
    lang: ['数据视图', '关闭', '导出Excel'],
    contentToOption: function (opts) {
            $("#displacementAnalysisExcel").table2excel({
            exclude: ".noExl", //过滤位置的 css 类名
            filename:   $("#s2id_analysisParameter .select2-chosen").text().replace(/\s*/g,"") + " - 排量(L) 散点图数据", //文件名称
            name: "Excel Document Name.xls",
            exclude_img: true,
            exclude_links: true,
            exclude_inputs: true
        });
    },
    optionToContent: function(opt) {
        var axisData = opt.xAxis[0].dat