表格对象接口

和 10.0 区别：

10.0 无此类接口

安装了「FineVis数据可视化」插件 V1.8.0 及之后版本，FVS 可视化看板支持 getCell、getRow、getColumn、getRowCount、getColumnCount、onMouseClick、onMouseMoveInCell、scrollTo、getScrollOffset、setRadius、showToolTip 接口。

row：number

col：number

注： 合并的单元格，col、row 需要输入合并后单元格的首行号/首列号，否则返回 undefined

row：单元格行号，数字，从 1 开始

col：单元格列号，数字，从 1 开始

object

示例1：若获取到的报表块定义为 report，获取该报表块的 A1 单元格

report.getCell(1,1);

示例2：决策报表中获取 report0 报表块中 A1 单元格

_g().getWidgetByName('report0').getCell(1,1);

示例3：普通报表中获取 A1 单元格

_g().getCell(1,1);

示例4：将普通报表中 A1 单元格的字体设置为红色、14 号

_g().getCell(1,1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例5：将决策报表中 report0 报表块 A1 单元格的字体设置为红色、14 号

_g().getWidgetByName('report0').getCell(1,1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例6：获取 FVS可视化看板中「表格1」组件中 A1 单元格

duchamp.getWidgetByName("表格1").getCell(1,1);

示例7：将 FVS 可视化看板中「表格1」组件 A1 单元格的字体设置为红色、20 号

duchamp.getWidgetByName("表格1").getCell(1,1).setStyle({
	fontSize: 20,
	color: 'red'
});

点击按钮，将决策报表中 report0 报表块 A1 单元格的字体设置为红色、14 号：

点击可下载模板：获取单元格后修改单元格样式.frm

FVS 可视化看板：JS修改表格组件单元格样式.fvs

index：number

index：行号，数字，从 1 开始

object

示例1：若获取到的报表块定义为 report，获取该报表块第一行单元格对象

report.getRow(1);

示例2：决策报表中获取 report0 报表块中第一行单元格对象

_g().getWidgetByName('report0').getRow(1);

示例3：普通报表中获取第一行单元格对象

_g().getRow(1);

示例4：将普通报表中，第一行单元格的字体都设置为红色、14号

_g().getRow(1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例5：将决策报表中 report0 报表块的第一行单元格的字体都设置为红色、14 号

_g().getWidgetByName('report0').getRow(1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例6：获取 FVS 可视化看板中「表格1」组件中第一行单元格对象

duchamp.getWidgetByName("表格1").getRow(1);

示例7：将 FVS 可视化看板中「表格1」组件的第一行单元格的字体都设置为红色、20 号

duchamp.getWidgetByName("表格1").getRow(1).setStyle({
	fontSize: 20,
	color: 'red'
});

点击按钮，将决策报表中 report0 报表块的第一行单元格的字体都设置为红色、14 号：

点击可下载模板：获取行后修改行单元格样式.frm

FVS 可视化看板：JS修改表格组件行单元格样式.fvs

index：number

index：列号，数字，从 1 开始

object

示例1：若获取到的报表块定义为 report，获取该报表块第一列单元格对象

report.getColumn(1);

示例2：决策报表中获取 report0 报表块中第一列单元格对象

_g().getWidgetByName('report0').getColumn(1);

示例3：普通报表中获取第一列单元格对象

_g().getColumn(1)

示例4：将普通报表中，第一列单元格的字体都设置为红色、14 号

_g().getColumn(1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例5：将决策报表中 report0 报表块的第一列单元格的字体都设置为红色、14 号

_g().getWidgetByName('report0').getColumn(1).setStyle({
	fontSize: 14,
	color: 'red'
});

示例6：获取 FVS 可视化看板中「表格1」组件中第一列单元格对象

duchamp.getWidgetByName("表格1").getColumn(1);

示例7：将 FVS 可视化看板中「表格1」的第一列单元格的字体都设置为红色、20 号

duchamp.getWidgetByName("表格1").getColumn(1).setStyle({
	fontSize: 20,
	color: 'red'
});

点击按钮，将决策报表中 report0 报表块的第一列单元格的字体都设置为红色、14 号：

点击可下载模板：获取列后修改列单元格样式.frm

FVS 可视化看板：JS修改表格组件列单元格样式.fvs

-

-

number

示例1：若获取到的报表块定义为 report，获取该报表块的总行数

report.getRowCount();

示例2：决策报表中获取 report0 报表块的总行数

_g().getWidgetByName('report0').getRowCount();

示例3：普通报表中，获取单元格行数：

_g().getRowCount();

示例4：获取 FVS 可视化看板中「表格1」组件的总行数

duchamp.getWidgetByName("表格1").getRowCount();

示例5：获取决策报表中 report0 报表块的总行数后，通过弹窗显示总行数

var a=_g().getWidgetByName('report0').getRowCount();
FR.Msg.alert("提示","报表块共"+a +"行");

点击按钮，获取决策报表中 report0 报表块的总行数：

点击可下载模板：获取表格共有多少行.frm

FVS 可视化看板：JS获取表格组件总行数.fvs

-

-

number

示例1：若获取到的报表块定义为 report，获取该报表块的总列数

report.getColumnCount();

示例2：获取决策报表中 report0 报表块的总列数

_g().getWidgetByName('report0').getColumnCount();

示例3：普通报表中，获取单元格行数

_g().getColumnCount();

示例4：获取 FVS 可视化看板中「表格1」组件的总列数

duchamp.getWidgetByName("表格1").getColumnCount();

示例5：获取决策报表中 report0 报表块的总列数后，通过弹窗显示总列数

var a=_g().getWidgetByName('report0').getColumnCount();
FR.Msg.alert("提示","报表块共"+a +"列");

点击按钮，获取决策报表中 report0 报表块的总列数：

点击可下载模板：获取表格共有多少列.frm

FVS 可视化看板：JS获取表格组件总列数.fvs

func：Function

func：回调方法，函数形式

-

示例1：若获取到的报表块定义为 report，给该报表块绑定一个点击后弹窗提醒的事件

report.onMouseClick(
	function() {
		FR.Msg.alert("警告", "不要乱动");
	}
);

示例2：给决策报表中 report0 报表块绑定一个点击后弹窗提醒的事件

_g().getWidgetByName('report0').onMouseClick(
		function() {
			FR.Msg.alert("警告","不要乱动");
		}
	);

示例3：给普通报表绑定一个点击后弹窗提醒的事件

_g().onMouseClick(
		function() {
			FR.Msg.alert("警告","不要乱动");
		}
	);

示例4：给 FVS 可视化看板中「表格1」组件绑定一个点击后弹窗提醒的事件

duchamp.getWidgetByName("表格1").onMouseClick(
    function() {
	duchamp.Msg.alert({
           title: "警告" ,
           message:"不要乱动"});
	}
);

示例5：给决策报表 report0 报表块绑定一个点击后开启跑马灯的事件

_g().getWidgetByName('report0').onMouseClick(
	function() {
		_g().getWidgetByName('report0').startMarquee()
	}
);

给决策报表 report0 报表块绑定点击后开启跑马灯的事件，当鼠标点击报表块时，开启跑马灯：

点击可下载模板：点击表格开启跑马灯.frm

FVS 可视化看板：点击表格开启跑马灯.fvs

func：Function

func：回调方法，函数形式

-

示例1：若获取到的报表块定义为 report，给该报表块绑定一个移入表格后弹窗提醒的事件

report.onMouseMoveInCell(
	function() {
		FR.Msg.alert("警告", "不要乱动");
	}
);

示例2：给决策报表中 report0 报表块绑定一个鼠标移入后弹窗提醒的事件

_g().getWidgetByName('report0').onMouseMoveInCell(
		function() {
			FR.Msg.alert("警告","不要乱动");
		}
	);

示例3：给普通报表绑定一个鼠标移入后弹窗提醒的事件

_g().onMouseMoveInCell(
	function() {
		FR.Msg.alert("警告", "不要乱动");
	}
);

示例4：给 FVS 可视化看板中「表格1」组件绑定一个移入表格后弹窗提醒的事件

duchamp.getWidgetByName("表格1").onMouseMoveInCell(
    function() {
	duchamp.Msg.alert({
           title: "警告" ,
           message:"不要乱动"});
	}
);

示例5：给决策报表 report0 报表块绑定一个鼠标移入后开启跑马灯的事件

_g().getWidgetByName('report0').onMouseMoveInCell(
	function() {
		_g().getWidgetByName('report0').startMarquee()
	}
);

给决策报表 report0 报表块绑定鼠标移入后弹窗事件，当鼠标移入报表块时，弹窗提醒：

点击可下载模板：鼠标移入表格时弹窗提醒.frm

FVS 可视化看板：鼠标移入表格组件弹窗提醒.fvs

func：Function

func：回调方法，函数形式

-

示例1：若获取到的报表块定义为 report，给该报表块绑定一个移出表格单元格后弹窗提醒的事件

report.onMouseMoveOutCell(
	function() {
		FR.Msg.alert("警告", "你已不在表格上");
	}
);

示例2：给决策报表中 report0 报表块绑定一个移出表格单元格后弹窗提醒的事件

_g().getWidgetByName('report0').onMouseMoveOutCell(
		function() {
			FR.Msg.alert("警告","你已不在表格上");
		}
	);

示例3：给普通报表绑定一个鼠标移出后弹窗提醒的事件

_g().onMouseMoveOutCell(
		function() {
			FR.Msg.alert("警告","你已不在表格上");
		}
	);

示例4：给决策报表 report0 报表块绑定一个移出表格单元格后表格第一行颜色变化的事件：

_g().getWidgetByName('report0').onMouseMoveOutCell(
	function() {
		_g().getWidgetByName('report0').getRow(1).setStyle({
			color: 'red'
		});
	}
);

示例5：给 FVS 可视化看板中「表格1」组件绑定一个移出单元格后第一行变色事件

duchamp.getWidgetByName("表格1").onMouseMoveOutCell(
        function() {
                duchamp.getWidgetByName("表格1").getRow(1).setStyle({
                        fontSize: 20,
                        color: 'red'
                });
        }
);

给决策报表 report0 报表块绑定鼠标移出单元格后第一行变色事件，当鼠标移出 A1 单元格后，报表块第一行颜色变化成红色：

点击可下载模板：鼠标移出表格时颜色变化.frm

FVS 可视化看板：鼠标移出单元格颜色变化.fvs

opts: Object 

{

    x: number, 

    y: number 

}

opts:   滚动距离，json 格式

• x：横向滚动距离，数字类型，可选字段，不指定则保持现状

• y：垂直滚动距离，数字类型，可选字段，不指定则保持现状

-

示例1：若获取到的报表块定义为 report，设置该报表块横向滚动 50 纵向滚动 100 ：

report.scrollTo({
x: 50,//横向
y: 100 //纵向
});

示例2：将决策报表中 report0 报表块横向滚动 50 纵向滚动 100：

_g().getWidgetByName('report0').scrollTo({
x: 50,//横向
y: 100 //纵向
});

示例3：将普通报表横向滚动 50 纵向滚动 100：

_g().scrollTo({
x: 50,//横向
y: 100 //纵向
});

示例4：将 FVS 可视化看板中「表格1」组件横向滚动 50 纵向滚动 100：

duchamp.getWidgetByName("表格1").scrollTo({
       x: 50,//横向
       y: 100 //纵向
});

示例5：将决策报表 report0 报表块横向滚动 50 纵向滚动 100：

_g().getWidgetByName('report0').scrollTo({
y: 100 //纵向
});

将决策报表 report0 报表块横向不变，纵向滚动 100：

点击可下载模板：设置报表块自动滚动到某个位置.frm

FVS 可视化看板：设置表格滚动到某个位置.fvs

-

-

opts: Object 

{

    x: number, 

    y: number 

}

opts:   滚动位置，json 格式

• x：横向滚动距离，数字类型，可选字段，不指定则保持现状

• y：垂直滚动距离，数字类型，可选字段，不指定则保持现状

示例1：若获取到的报表块定义为 report，获取该报表块当前滚动到的位置

report.getScrollOffset();

示例2：获取决策报表中 report0 报表块当前滚动到的位置

_g().getWidgetByName('report0').getScrollOffset();

示例3：获取普通报表当前纵向滚动条所在的位置

var a=_g().getScrollOffset().y;
FR.Msg.alert("提示","当前纵向位置"+a );

示例4：获取 FVS 可视化看板中「表格1」组件当前纵向滚动到的位置

duchamp.getWidgetByName("表格1").getScrollOffset().y;

示例5：获取决策报表中 report0 报表块当前滚动到的位置并弹窗提醒当前位置

var a=_g().getWidgetByName('report0').getScrollOffset().y;
FR.Msg.alert("提示","当前纵向位置"+a );

获取决策报表中 report0 报表块当前滚动到的位置并弹窗提醒当前位置：

点击可下载模板：获取报表块滚动到的位置.frm

FVS 可视化看板：获取表格滚动到的某个位置.fvs

radius: number

range: Object 

{

    row: [row1:number,row2:number,), 

    column: [column1:number,column  2:number], 

    cell: [col:number, row:number] 

}

single: boolean

1）radius：圆角程度，数字

2）range：圆角范围，json 格式，可选字段，默认为整个表格单元格

• row：圆角行的范围，可选字段，代表 row1 行 到 row2 行，row1 和row2 都是数字

• column：圆角列的范围，可选字段，代表 column1 列到 column2 列，column1 和 column2 都是数字

• cell：圆角单元格的范围，可选字段，代表col 列，row 行的单元格，col 和 row 都是数字

3）single: 决定圆角的形式，布尔型，默认为false

• true：选区内每个单元格圆角

• false：整个选区为圆角

-

-

示例1：若获取到的报表块定义为 report，给该报表块整体设置一个 25 的圆角：

report.setRadius(25);

示例2：给决策报表中 report0 报表块整体设置一个 25 的圆角：

_g().getWidgetByName('report0').setRadius(25);

示例3：给决策报表中 report0 报表块 A1 单元格设置一个 25 的圆角：

_g().getWidgetByName('report0').setRadius(25, {
cell: [1,1]
}, false); 

示例4：给决策报表中 report0 报表块第 1 行到第 3 行整体设置一个 25 的圆角：

_g().getWidgetByName('report0').setRadius(25, {
row: [1,3],
}, false); 

示例5：给决策报表中 report0 报表块第 2 列到第 5 列整体设置一个 25 的圆角：

_g().getWidgetByName('report0').setRadius(25, {
column: [2,5]
}, false); 

示例6：给普通报表第 1 行到第 3 行整体设置一个 25 的圆角：

_g().setRadius(25, {
row: [1,3],
}, false); 

示例7：给 FVS 可视化看板中「表格1」组件单元格整体设置一个 25 的圆角：

duchamp.getWidgetByName("表格1").setRadius(25);

点击按钮，给决策报表中 report0 报表块第 1 行设置一个 25 的圆角：

点击可下载模板：设置单元格圆角.frm

FVS 可视化看板：设置单元格行圆角.fvs

opts: Object

{

    show: boolean,

    content: { 

        text: string, // 文字

        image: string, // 图片

        header: string // 标题

    }

    style: { 

    }

}

opts: 弹窗选项，是个对象

1）show：是否会出现弹窗，布尔型，true 为出现，false 为不出现

2）content：可选字段，不指定即为显示文字，内容为单元格中的值

• text: 提示的内容，字符串

• image: 图片 URL 路径，字符串，图片格式支持 pn   g、jpg。图片来源可以为网页图片，如：

https://www.fanruan.com/images/logo-fanruan.png

也可以将图片放置在报表工程目录 %FR_HOME%\webapps\webroot 下，通过 URL 访问。如：

http://localhost:8075/webroot/11.jpg

• header: 标题

3）style: 可选字段，不指定则为默认样式，支持的样式可参考：单元格样式属性style

-

-

示例1：若获取到的报表块定义为 report，给该报表块设置一个标题为“提示”，内容为红色“地区销售数据”字样的提示框： 

report.showToolTip({
	show: true, // 是否会出现弹窗
	content: { // 可选字段，不指定即为显示文字
		text: "地区销售数据", // 文字
		header: "提示" // 标题
	},
	style: { // 可选字段，不指定为默认样式，支持css标准样式的字段
		color: "#DC143C"
		//符合css规则
	}
});

示例2：给决策报表中 report0 报表块设置一个标题为“提示”，内容为红色“地区销售数据”字样的提示框： 

_g().getWidgetByName('report0').showToolTip({
	show: true, // 是否会出现弹窗
	content: { // 可选字段，不指定即为显示文字，内容为cell.getValue();
		text: "地区销售数据", // 文字
		header: "提示" // 标题
	},
	style: { // 可选字段，不指定为默认样式，支持css标准样式的字段
		color: "#DC143C"
		//符合css规则
	}
});

示例3：给普通报表设置一个标题为“提示”，内容为网页图片帆软 LOG 的提示框： 

_g().showToolTip({
	show: true, // 是否会出现弹窗
	content: { // 可选字段，不指定即为显示文字，内容为cell.getValue();
		image: "https://www.fanruan.com/images/logo-fanruan.png",
		header: "提示" // 标题
	}
});

示例4：给决策报表中 report0 报表块设置一个没有标题，内容为红色“地区销售数据”字样的提示框： 

_g().showToolTip({
	show: true, // 是否会出现弹窗
	content: { // 可选字段，不指定即为显示文字，内容为cell.getValue();
		image: "https://www.fanruan.com/images/logo-fanruan.png",
		header: "提示" // 标题
	}
});

示例5：给 FVS 可视化看板中「表格1」组件设置一个标题标题为“提示”，内容为单元格值默认样式的提示框

注：在 FVS 中使用该接口，鼠标悬浮出现提示后，需要点击下模板其他任意位置，提示才会消失。

duchamp.getWidgetByName("表格1").showToolTip({
	show: true, // 是否会出现弹窗
	content: { 
		header: "提示" // 标题
	}
});

给决策报表中 report0 报表块设置一个标题为“提示”，内容为红色“地区销售数据”字样的提示框： 

点击可下载模板：鼠标悬浮单元格文字提示.frm

FVS 可视化看板：鼠标悬浮单元格文字提示.fvs