x-sheet开发教程:核心API的使用x-sheet开发教程:如何介绍二次开发x-sheet是一个高性能的WebJavaScriptCanvas电子表格,之前写了一篇x-sheet的入门经验,简单介绍了x-sheet的使用方法。这一次,让我们更深入地了解x-sheet支持的其他配置。通过修改配置,我们可以定制我们的表格布局和功能。最新原创X-Sheet开发教程:初始配置自定义布局配置在使用X-Sheet的过程中,小编总结了一个比较完整的配置清单,可以参考下。constsettings={//工作簿配置workConfig:{//创建时间created:"",//修改时间modified:"",//作者信息creator:"",//最后修改作者lastModifiedBy:"",//工作簿名称name:"x-sheet",//顶部配置top:{//顶部选项栏配置option:{//是否显示选项栏show:true,},//顶部菜单栏配置menu:{//是否显示菜单栏show:true,},},//主体配置body:{//Worksheet菜单配置sheetConfig:{//是否显示右键菜单showMenu:true,},//Worksheetbody配置sheets:[{//工作表名称name:"sheet1",//表格配置tableConfig:{//标题行列配置index:{//标题行高height:30,//标题列宽width:50,//标题行和列的边框颜色gridColor:"rgb(193,193,193)",//标题行和列的字体大小:12,//标题行和列的字体颜色color:"rgb(0,0,0)",},//表格整体配置table:{//是否显示网格线showGrid:true,//表格区域背景色background:"rgb(255,255,255)",//网格颜色gridColor:"rgb(225,225,225)",},//行配置rows:{//自定义最大行数len:100,//默认行高height:30,//行配置数据data:[{//自定义行高度,不设置则使用默认行高height:100},],},//列配置cols:{//自定义最大列数len:25,//默认列宽width:110,//行配置数据data:[{//自定义列宽,不设置则使用默认列宽width:200}],},//冻结范围xFixedView:{//冻结列索引,-1不冻结fxLeft:-1,//冻结行索引,-1不冻结fxTop:-1,},//冻结分割线样式xFixedBar:{//冻结行分割线高度height:16,//冻结列分割线宽度width:26,//冻结分割线背景色background:"rgb(234,234,234)",//背景冻结分割线按钮颜色buttonColor:"rgb(193,193,193)",},//表格数据,二维数组数据:[[//A1单元格数据{//单元格类型contentType:2,//字体属性fontAttr:{//换行符textWrap:2,//方向direction:"vertical",},//富文本配置richText:{//富文本具体字段信息rich:[//第一段富文本{//字体名称:"宋体",//字体大小size:14,//文字内容text:"我是",//字体颜色color:"rgb(255,0,2)",//是否加粗bold:false,//是否加粗alic:false,//是否有删除线strikethrough:false,//是否有下划线underline:false,},{//富文本第二段包含的字符//如果没有配置样式,取单元格的样式,单元格没有样式,所以取默认样式text:"richtext",},],},},{//背景色background:"rgb(255,255,0)",//单元格图标icons:[],//自定义属性custom:{},//字体测量标尺ruler:undefined,//格式类型format:"default",//单元格公式formula:undefined,//文本内容text:"Text",//格式化内容formatText:"Text",//内容宽度contentWidth:100,//内容高度contentHeight:100,//字体属性fontAttr:{//字体名称:"Arial",//字体大小size:14,//字体颜色color:"rgb(0,0,0)",//是否加粗:false,//是否加粗:false,//是否有删除线strikethrough:false,//是否有下划线underline:false,//padding:5,//文字转角degreeangle:0,//文字方向direction:"horizo??ntal",//'horizo??ntal''vertical''angle''bar'//水平对齐align:"left",//'left''center''right'//垂直对齐verticalAlign:"middle",//'top''middle''bottom'//自动换行textWrap:1,//1overflow2wrap3truncate},//边框属性borderAttr:{//Leftborderleft:{//levelzIndex:0,//是否显示display:true,//宽度类型widthType:"low",//'low''medium''high'//colorcolor:"rgb(0,0,0)”;,//线型type:0,//0solid1dotted2point3double},//rightborderright:{zIndex:0,display:true,widthType:"medium",color:"rgb(0,255,0)",type:0,},//顶部边框top:{zIndex:0,display:false,widthType:"high",color:"rgb(0,0,255)",type:0,},//底部边框bottom:{zIndex:0,display:true,widthType:"high",color:"rgb(0,255,255)",type:3,},},},],],//保护配置protection:{protections:[],},//是否保护sheetProtection:true,//合并单元格merge:{merges:["A2:B3","D5:H9"]},},},],//工作表选项卡配置tabConfig:{//是否显示选项卡右键菜单showMenu:true,},},//底部状态栏配置bottom:{//是否显示状态栏show:true,},},};//初始化x-sheetnewXSheet("#demo1",settings);summarizex-sheet目前还在开发中,部分API还不稳定,以后会有变化。小编会及时更新的。参考X-Sheet开发教程:初始化和配置自定义布局。去体验
