bojue / canvas-excel

基于Canvas开发Excel的技术预研项目(React)
https://bojue.github.io/canvas-excel
71 stars 11 forks source link

预研方案记录 #6

Open bojue opened 4 years ago

bojue commented 4 years ago
  1. 文本行高度裁剪问题

方案:裁剪+离屏方案 Demo image

bojue commented 3 years ago

luckysheetfile 的数据结构

 {
    "name": "Cell", //Worksheet name
    "color": "", //Worksheet color
    "config": {}, //Table row height, column width, merged cells, borders, hidden rows and other settings
    "index": "0", //Worksheet index
    "chart": [], //Chart configuration
    "status": "1", //Activation status
    "order": "0", //The order of the worksheet
    "hide": 0,//whether to hide
    "column": 18, //Number of columns
    "row": 36, //number of rows
    "celldata": [], //Original cell data set
    "visibledatarow": [], //The position of all rows
    "visibledatacolumn": [], //The position of all columns
    "ch_width": 2322, //The width of the worksheet area
    "rh_height": 949, //The height of the worksheet area
    "scrollLeft": 0, //Left and right scroll bar position
    "scrollTop": 315, //Up and down scroll bar position
    "luckysheet_select_save": [], //selected area
    "luckysheet_conditionformat_save": {},//Conditional format
    "calcChain": [],//Formula chain
    "isPivotTable":false,//Whether to pivot table
    "pivotTable":{},//Pivot table settings
    "filter_select": null,//Filter range
    "filter": null,//Filter configuration
    "luckysheet_alternateformat_save": [], //Alternate colors
    "luckysheet_alternateformat_save_modelCustom": []//Customize alternate colors
}

中文

{
    "name": "Cell", //工作表名称 
    "color": "", //工作表颜色 
    "index": "0", //工作表索引 
    "status": "1", //激活状态 
    "order": "0", //工作表的顺序 
    "hide": 0, //是否隐藏 
    "row": 36, //行数 
    "column": 18, //列数 
    "config": {
        "merge": {}, //合并单元格 
        "rowlen": {}, //表格行高 
        "columnlen": {}, //表格列宽 
        "rowhidden": {}, //隐藏行 
        "colhidden": {}, //隐藏列 
        "borderInfo": {}, //边框 
    },
    "celldata": [], //初始化使用的单元格数据 
    "data": [], //更新和存储使用的单元格数据 
    "scrollLeft": 0, //左右滚动条位置 
    "scrollTop": 315, //上下滚动条位置 
    "luckysheet_select_save": [], //选中的区域 
    "luckysheet_conditionformat_save": {}, //条件格式 
    "calcChain": [], //公式链 
    "isPivotTable": false, //是否数据透视表 
    "pivotTable": {}, //数据透视表设置 
    "filter_select": {}, //筛选范围 
    "filter": null, //筛选配置 
    "luckysheet_alternateformat_save": [], //交替颜色 
    "luckysheet_alternateformat_save_modelCustom": [], //自定义交替颜色     
    "freezen": {}, //冻结行列 
    "chart": [], //图表配置 
    "visibledatarow": [], //所有行的位置 
    "visibledatacolumn": [], //所有列的位置 
    "ch_width": 2322, //工作表区域的宽度 
    "rh_height": 949, //工作表区域的高度 
    "load": "1", //已加载过此sheet的标识 
}
bojue commented 3 years ago

excel界面结构

1、 标题栏:显示默认的文件名称,如果是打开的文件,则显示打开的文件名称 2、 选项卡:EXCEL不同功能分组名称,单击可以切换 3、 图标功能区:对应选项卡显示不同的命令图标 4、 编辑栏:左侧显示名称,右侧是编辑框(公式编辑,内容编辑) 5、 功能区:直接就是一个表格,EXCEL默认是有1048576行,16384列 6、 行号与列标:标识那一行,标识那一列 7、 工作表切换标签:可以增加,可以切换 8、 状态栏:可以切换视图,控制显示比例

excel 2013窗口组成介绍:

1、快速访问工具栏:添加你常用的命令,方便我们快速操作和访问; 2、标题栏:此处一般显示excel工作簿的保存名称; 3、选项卡:其实这里就是excel2003的菜单栏,这里呈现了刻在excel中执行的核心任务; 4、工具栏:这里我们都知道,这里属于excel的工具栏,我们可以通过工具栏快速的执行操作; 5、单元格名称框:这里主要显示每个单元格和单元格区域的名称,我们可以对单元格和单元格区域定义名称; 6、编辑栏:我们可在编辑栏输入数据和excel公式; 7、列号:显示每一列单元格的列号; 8、行号:显示每一行单元格的行号; 9、工作区:工作区由很多excel单元格组成,工作区的没一个方格都是一个单元格; 10、工作表标签:每一个excel工作簿默认都会创建3个工作表标签,我们可以添加删除excel工作表; 11、滚动条:分别为垂直和水平滚动条; 12、状态栏:显示工作表的状态,还有调节工作表显示比例的按钮。

bojue commented 3 years ago

钉钉文档Excel

O1CN01K7m7Z728FckqdcTpA_!!6000000007903-0-tps-720-405 O1CN01mR51Xn1qFTXl4M6rZ_!!6000000005466-0-tps-720-405 O1CN01AH9soG1TuwEdbr0Sx_!!6000000002443-0-tps-720-405 O1CN01wZI0911sfhS5oa9Ns_!!6000000005794-0-tps-720-405