js excel 在线插件合并单元格设置单元格样式编辑工具

地址http://www.dataexcel.cn/ 1、js 版本 es6

2、绘图引擎 zrender 地址 ZRender 文档 (ecomfe.github.io)

3、文件保存格式json

4、创建并初始化

        <div id="maingrid" style="position: static; width: 100%; height: 100%;  box-sizing: border-box "><div id="grid" style="position: relative; width: 1200px; height: 600px;  "> </div></div>

    <script type="text/javascript">var domgrid = document.getElementById("grid");var input = document.getElementById("maininput");var grid = new DataExcel();grid.Width = domgrid.Width;grid.Height = domgrid.Height;grid.InitDom(domgrid);grid.InitEdit(input);grid.Refresh();grid.Paint();grid.On(Events.FocusedCellChanged, FocusedCellChanged);function FocusedCellChanged(args){console.log("事件触发测试:" + args);}</script>

5、文件新建保存

    <!--File--><script type="text/javascript">function New(){grid.Clear();grid.VScroll.Visible = true;grid.HScroll.Visible = true;grid.Refresh();grid.RePaint();}function Open(){let inputObj = document.createElement('input')inputObj.setAttribute('id', '_ef');inputObj.setAttribute('type', 'file');inputObj.setAttribute("style", 'visibility:hidden');document.body.appendChild(inputObj);inputObj.addEventListener("change", fileopen)//inputObj. = fileopen()inputObj.click();}function fileopen(e){let inputObj = e.target;let file = inputObj.files[0];console.log(file);grid.OpenFile(file);document.body.removeChild(inputObj);grid.Refresh();grid.RePaint();}function Save(){//let domfile = document.getElementById("file");let content = JSON.stringify(grid.GetData());//domfile.innerText = content;let fileName = "grid.json";let downLink = document.createElement('a')downLink.download = fileNamelet blob = new Blob([content], { type: 'text/json' })downLink.href = URL.createObjectURL(blob)document.body.appendChild(downLink)downLink.click()document.body.removeChild(downLink)}function OpenDialogSize(){//let dialog = document.getElementById("modaldomwidthheight");//dialog.modal({//    keyboard: false//});let domwidth = document.getElementById("gridwidth");let width = grid.Width;let domheight = document.getElementById("gridheight");let height = grid.Height;domwidth.value = width;domheight.value = height;$('#modaldomwidthheight').modal({keyboard: false})}function SaveGridSize(){let domwidth = document.getElementById("gridwidth");let width = Number(domwidth.value);let domheight = document.getElementById("gridheight");let height = Number(domheight.value);grid.SetSize(width, height);grid.Refresh();grid.RePaint();}function Preview(){let key = (Math.round(Math.random() * 65536)).toString(16) +(Math.round(Math.random() * 65536)).toString(16) +(Math.round(Math.random() * 65536)).toString(16) +(Math.round(Math.random() * 65536)).toString(16) +(Math.round(Math.random() * 65536)).toString(16);let arg = "?k=" + key + "&zoom=true";let content = JSON.stringify(grid.GetData());localStorage.setItem(key, content);window.open("demo.html" + arg);}function Scale(){var zw = 0.7;var zh = 0.7;document.body.style.transformOrigin = '0 0';document.body.style.transform = 'scale(' + zw + ',' + zh + ')';document.body.style.width = window.innerWidth / zw + 'px';document.body.style.height = window.innerHeight / zh + 'px';grid.SetSize(grid.Width, grid.Height);grid.Refresh();grid.Paint();}function Restore(){var zw = 1;var zh = 1;document.body.style.transformOrigin = '0 0';document.body.style.transform = 'scale(' + zw + ',' + zh + ')';document.body.style.width = window.innerWidth / zw + 'px';document.body.style.height = window.innerHeight / zh + 'px';grid.SetSize(grid.Width, grid.Height);grid.Refresh();grid.Paint();}function ReadOnly(){grid.ReadOnly = CheckState.Check;grid.Refresh();grid.RePaint();}function UnReadOnly(){grid.ReadOnly = CheckState.UnCheck;grid.Refresh();grid.RePaint();}</script>

js excel 在线插件合并单元格设置单元格样式编辑工具相关推荐

Python 操作 excel 插入图片、表格、设置单元格颜色、字体（三）
Python 操作 excel 插入图片.表格.设置单元格颜色.字体 python 操作 excel 插入图片.表格.设置单元格颜色.字体提示:以下是本篇文章正文内容,下面案例可供参考一.open ...
Excel函数 - 批量合并相同内容的单元格
问题:如下图所示,我想把相同的种类合并到1个单元格中.由图1变为图2. 第一步:我们在C列标题行下面的第一行(即c2单元格)写下这样的公式"=IF(A2=A1,C1,C1+1) " ...
Vue+SpringBoot实现Excel在线预览功能（PS：添加样式比较费劲）
** 问题还原: ** 在做项目时,用户需要上传Excel模板,里面有对应的各种数据.我们拿到这个Excel后,定时的根据其中的数据去查对应的实时数据并进行计算,然后将实时数据和计算后的数据保存到Ex ...
JS XML在线格式化、压缩、校验、XML转JSON工具-toolfk程序员工具网
本文要推荐的[ToolFk]是一款程序员经常使用的线上免费测试工具箱,ToolFk 特色是专注于程序员日常的开发工具,不用安装任何软件,只要把内容贴上按一个执行按钮,就能获取到想要的内容结果.Tool ...
C#实现向excel中插入行列，以及设置单元格合并居中效果
插入空行: Microsoft.Office.Interop.Excel.Workbook xlsWorkbook; Microsoft.Office.Interop.Excel.Worksheet ...
Excel导出且合并相同值的单元格
1.合并单元格工具类 /*** 导出excel工具类*/ public class ExportExcelUtil {public ExportExcelUtil() {super();}/*** @ ...
Markdown表格—合并单元格—设置单元格颜色
Markdown表格设计 ~~~~~~~我之前做表格遇到一些问题,特别是两个小表格想要放在同一行,却不行,所以想着要合并单元格.但是多个表格合并和想要分割线却没有,只好用颜色代替了.但是Markdow ...
excel条件格式--根据数值来设置单元格格式，呈阶梯形效果
原始数据目标效果操作方法 1.选中A4,选择菜单"开始"--"条件格式"--"新建规则"--"使用公式确定要设置格式的单元格& ...
阿里EasyExcel对Excel复杂模版填充实现并设置单元格格式
easyExcel模版示例地址: 接下来代码展示 1.添加easyExcel依赖 <dependency><groupId>com.alibaba</groupId> ...

js excel 在线插件合并单元格设置单元格样式编辑工具

js excel 在线插件合并单元格设置单元格样式编辑工具相关推荐

最新文章

热门文章

js excel 在线插件 合并单元格 设置单元格样式 编辑工具

js excel 在线插件 合并单元格 设置单元格样式 编辑工具相关推荐

最新文章

热门文章

js excel 在线插件合并单元格设置单元格样式编辑工具

js excel 在线插件合并单元格设置单元格样式编辑工具相关推荐