文档章节

json转换成excel在线小工具分享

 陈嘉镇
发布于 2017/09/10 17:44
字数 862
阅读 15
收藏 0
点赞 0
评论 0

起因

我们在工作过程中,偶尔会有需求是把json转换成excel的需求。一般这个时候,我们会跑到度娘那,在输入框中输入:“json excel”。然后,你会发现这个一个网站“https://json-csv.com/”, 出现在结果的第一个位置。 image

进去用了一下,很好用。收藏了。但是过几天,又要用的时候,忽然发现,导不出excel了。盯着上面的英文看了一会。发现这TMD的网站,居然对文件大小进行了限制。必须注册,收费才能上传大于1m以上的文件。@##$#$%$%&^&^*%^% image

这个功能对于我来说,并非刚需,也是偶发的。而且感觉也不会太难,于是就起了自己做一个“在线小工具”的念头。放开大小限制,让大伙痛快的用。 image

操作也是差不多,支持直接输入json和文件上传。可以导出xls,也可以导出xlsx。如果你的数据比较多的话,建议使用firefox浏览器,导出为xlsx。之所以建议你用导出xlsx,是因为如果导出的行数超过6w的话,xls是不支持的。而推荐使用firefox的原因是因为我的代码实现方式,需要用到dataURI。各个浏览器,对它的大小有限制。firefox则是无限制。使用它导出15M的json,都是秒级的,很快。

大家可以体验下http://j2e.kpoda.com/

硬货

以下是主要代码

function exportJson2Excel(json, type) {
      //TODO 记录导出操作日志
      var log = {"type": "json2excel"};
//title
      try {
        var title = new Set();
        for (var i = 0; i < json.length; i++) {
          var r = json[i];
          getProFromObject(r, title);
        }
        console.log("title", title);

        var data = [];
        for (var i = 0; i < json.length; i++) {
          var r = json[i];
          var dataRow = [];
          title.forEach(function (t) {
            var d1 = r[t];
            var ss = t.split(".");
            if (ss.length >= 2) {
              var tmp = r;
              for (var i = 0; i < ss.length; i++) {
                var s = ss[i];
                tmp = tmp[s];
                if (!tmp) {
                  break;
                }
              }
              d1 = tmp;
            }
            if (d1) {
              if (typeof d1 == 'object') {
                dataRow.push(JSON.stringify(d1));
              } else {
                dataRow.push(d1);
              }

            } else {
              dataRow.push("");
            }

          });

          data.push(dataRow);
        }
        console.log("data", data);
        jsonToExcelConvertor(data, 'Report', Array.from(title), type);
      } catch (err) {
        console.error(err);
        alert("导出报错:" + err.stack);
        log.error = err.stack;
        log.json =  json;
      } finally {
        OplogsService.save(log).$promise.then(function (res) {
          console.log(res);
        }).catch(function (error) {
          console.log(error);
          alert("系统错误:" + JSON.stringify(error));
        });
      }

    }

getProFromObject方法用来获取json对象的属性,其对应excel的列。其中用到了递归。

function getProFromObject(r, title, parentsPros) {
      for (var rp in r) {
        if (parentsPros) {
          title.add(parentsPros + "." + rp);
        } else {
          title.add(rp);
        }
        if (typeof r[rp] == 'object') {
          if (parentsPros) {
            getProFromObject(r[rp], title, parentsPros + "." + rp);
          } else {
            getProFromObject(r[rp], title, rp);
          }

        }
      }
    }

jsonToExcelConvertor方法用于把整理好的数据,转换为DataURI,输出excel。

function jsonToExcelConvertor(JSONData, FileName, ShowLabel, type) {
      type = type ? type : "xls";
      var application = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
      if (type == "xls") {
        application = "application/vnd.ms-excel";
      }

      // 先转化json
      var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;

      var excel = '<table>';

      // 设置表头
      var rr = '<tr>';
      for (var j = 0, l = ShowLabel.length; j < l; j++) {
        rr += '<td>' + ShowLabel[j] + '</td>';
      }


      // 换行
      excel += rr + '</tr>';

      // 设置数据
      for (var i = 0; i < arrData.length; i++) {
        var row = '<tr>';

        for (var index = 0; index < arrData[i].length; index++) {
          var value = arrData[i][index] === '.' ? '' : arrData[i][index];
          row += '<td>' + value + '</td>';
        }

        excel += row + '</tr>';
      }

      excel += '</table>';

      var excelFile = '<html xmlns:o=\'urn:schemas-microsoft-com:office:office\' xmlns:x=\'urn:schemas-microsoft-com:office:excel\' xmlns=\'http://www.w3.org/TR/REC-html40\'>';
      excelFile += '<meta http-equiv="content-type" content="' + application + '; charset=UTF-8">';
      excelFile += '<meta http-equiv="content-type" content="' + application;
      excelFile += '; charset=UTF-8">';
      excelFile += '<head>';
      excelFile += '<!--[if gte mso 9]>';
      excelFile += '<xml>';
      excelFile += '<x:ExcelWorkbook>';
      excelFile += '<x:ExcelWorksheets>';
      excelFile += '<x:ExcelWorksheet>';
      excelFile += '<x:Name>';
      excelFile += '{worksheet}';
      excelFile += '</x:Name>';
      excelFile += '<x:WorksheetOptions>';
      excelFile += '<x:DisplayGridlines/>';
      excelFile += '</x:WorksheetOptions>';
      excelFile += '</x:ExcelWorksheet>';
      excelFile += '</x:ExcelWorksheets>';
      excelFile += '</x:ExcelWorkbook>';
      excelFile += '</xml>';
      excelFile += '<![endif]-->';
      excelFile += '</head>';
      excelFile += '<body>';
      excelFile += excel;
      excelFile += '</body>';
      excelFile += '</html>';


      var uri = 'data:' + application + ';charset=utf-8,' + encodeURIComponent(excelFile);

      var link = document.createElement('a');
      link.href = uri;
      //TODO Cannot set property style of #<HTMLElement> which has only a getter
      // link.style = 'visibility:hidden';
      $(link).css("visibility", "hidden");
      // link.download = FileName + '.'+type;
      $(link).attr("download", FileName + '.' + type);
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    }

© 著作权归作者所有

共有 人打赏支持
粉丝 1
博文 1
码字总数 862
作品 0
东城
10种值得推荐的数据可视化工具

D3.js 基于JavaScript的数据可视化库,允许绑定任意数据到DOM,然后将数据驱动转换应用到Document中。 2. Data.js Data.js是一个JavaScript数据表示框架,提供统一的接口和数据域,是一款简单...

李朝强 ⋅ 2014/01/09 ⋅ 0

CSDN总结的面试中的十大可视化工具

1. D3.js 基于JavaScript的数据可视化库,允许绑定任意数据到DOM,然后将数据驱动转换应用到Document中。 2. Data.js Data.js是一个JavaScript数据表示框架,提供统一的接口和数据域,是一款...

文艺小青年 ⋅ 2017/05/05 ⋅ 0

Excel 表快速转换成 JSON 字符串

在游戏项目中一般都需要由策划制作大量的游戏内容,其中很大一部分是使用Excel表来制作的。于是程序就需要把Excel文件转换成程序方便读取的格式。 之前项目使用的Excel表导入工具都是通过Off...

kl28978113 ⋅ 04/08 ⋅ 0

如何将excel格式文件转换成pdf格式

在我们办公的时候会遇到很多种格式的文件,但是有时候我们做好文件之后,想要另外一种格式的文件,因为那样看起来会更加的快捷和方便,另外一个就是怕别人盗用我们的文件,所以我们会想把我们...

吃喝玩乐燕公子 ⋅ 2017/07/06 ⋅ 0

五款免费pdf转换成word软件下载

原文链接:http://www.wordlm.com/html/1711.html

liangxiaowei66 ⋅ 2014/05/29 ⋅ 0

如何实现网页在线浏览pdf excel word等文件?诸如百度文库,豆丁网那样

我就是想实现如百度文库,豆丁那样的效果。 我在网上看到的大概有两种思路: 1:直接嵌套在html中。这个其实是下载到了用户缓存中了,要是用户不在电脑上面装播放pdf,或者excel的软件,此法一...

chinaweilu ⋅ 2011/06/14 ⋅ 6

ABBYY把PDF转换Excel的方法

我们都知道2007以上版本的Office文档,是可以直接将文档转存为PDF格式文档的。那么反过来,PDF文档可以转换成其他格式的文档吗?这是大家都比较好奇的话题。如果可以以其他格式进行保存,就可...

ABBYY ⋅ 2016/12/20 ⋅ 0

Eran/ExcelToJson

#Excel2Json 概述 Excel2Json 是将Excel表格直接导出成JSON文件格式的一个小工具 使用方法 下载Release文件夹下所有文件,拷贝到本地目录 比如 D:ToolsExcel2Json 目录 修改Run.bat文件 : Ex...

Eran ⋅ 2015/11/26 ⋅ 0

python Excel 转 Json 格式工具--ExcelToJson

ExcelToJson 为 python 转换 excel 为 json 格式的工具, ExcelToJson 提供一个简单的界面(Tkinter),实现单个和批量转换的功能,其中批量转换使用多线程加快转换效率。 批量转换制定文件夹...

vbird ⋅ 2017/02/05 ⋅ 1

微软新神器 Power BI 横空出世

本文作者:伯乐在线 -数据之巅 。未经作者许可,禁止转载! 欢迎加入伯乐在线专栏作者。 在当前互联网,由于大数据研究热潮,以及数据挖掘,机器学习等技术的改进,各种数据可视化图表层出不...

伯乐在线 ⋅ 2016/06/27 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Java NIO之字符集

1 字符集和编解码的概念 首先,解释一下什么是字符集。顾名思义,就是字符的集合。它的初衷是把现实世界的符号映射为计算机可以理解的字节。比如我创造一个字符集,叫做sex字符集,就包含两个...

士别三日 ⋅ 32分钟前 ⋅ 0

Spring Bean基础

1、Bean之间引用 <!--如果Bean配置在同一个XML文件中,使用local引用--><ref bean="someBean"/><!--如果Bean配置在不同的XML文件中,使用ref引用--><ref local="someBean"/> 其实两种......

霍淇滨 ⋅ 37分钟前 ⋅ 0

05、基于Consul+Upsync+Nginx实现动态负载均衡

1、Consul环境搭建 下载consul_0.7.5_linux_amd64.zip到/usr/local/src目录 cd /usr/local/srcwget https://releases.hashicorp.com/consul/0.7.5/consul_0.7.5_linux_amd64.zip 解压consu......

北岩 ⋅ 40分钟前 ⋅ 0

Webpack 4 api 了解与使用

webpack 最近升级到了 v4.5+版 01 官方不再支持 node4 以下版本 官方不再支持 node4 以下版本官方不再支持 node4 以下的版本,所以如果你的node版本太低,先开始升级node吧!话说node10 ...

NDweb ⋅ 50分钟前 ⋅ 0

使用nodeJs安装Vue-cli

Vue脚手架就是一个Vue框架开发环境 脚手架的意思是帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要 npm install就可以安装,让我们不需要为了编辑或者一些其...

木筏笔歆 ⋅ 今天 ⋅ 0

【微信小程序开发实战】0x00.开发前准备工作

写在开始 本人资深后端码农一枚,近期项目需求,接触到了微信小程序,将学习过程整理成文分享给小伙伴们,由于是边学边整理难免有表述不对的地方,望大家及时指正,感谢。 本人微信号: dream...

dreamans ⋅ 今天 ⋅ 0

linux redis的安装和php7下安装redis扩展

安装redis服务器 (1)下载安装包: $ wget http://download.redis.io/releases/redis-2.8.17.tar.gz (2)编译程序: $ tar xzf redis-2.8.17.tar.gz $ cd redis-2.8.17 $ make $ cd src &&......

concat ⋅ 今天 ⋅ 0

Guava EventBus源码解析

一、EventBus使用场景示例 Guava EventBus是事件发布/订阅框架,采用观察者模式,通过解耦发布者和订阅者简化事件(消息)的传递。这有点像简化版的MQ,除去了Broker,由EventBus托管了订阅&...

SaintTinyBoy ⋅ 今天 ⋅ 0

http怎么做自动跳转https

Apache 版本 如果需要整站跳转,则在网站的配置文件的<Directory>标签内,键入以下内容: RewriteEngine on RewriteCond %{SERVER_PORT} !^443$ RewriteRule ^(.*)?$ https://%{SERVER_NAME......

Helios51 ⋅ 今天 ⋅ 0

Python爬虫,抓取淘宝商品评论内容

作为一个资深吃货,网购各种零食是很频繁的,但是能否在浩瀚的商品库中找到合适的东西,就只能参考评论了!今天给大家分享用python做个抓取淘宝商品评论的小爬虫! 思路 我们就拿“德州扒鸡”...

python玩家 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部