版本
| 报表服务器版本 | 功能变动 |
|---|---|
| 11.0.2 | 新增接口：
|
1）本文汇总的接口适用于 FineReport 所有的基础图表，且普通报表、决策报表、聚合报表均可以使用。
2）部分接口支持 11.0.63 及之后版本的移动端。
3）所有图表接口，均需在获取图表对象之后使用，获取图表对象接口可参考：图表对象接口
setSeriesVisible()
| 方法 | setSeriesVisible(); | 图表显示部分系列 |
|---|---|---|
| 参数说明 | - | |
| 示例 | var chart=FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
chart.setSeriesVisible([0,1]);//显示图表 chart0 的系列1和系列2点击查看文档：图表显示部分系列接口 | |
| 移动端 | 支持 | |
openAutoTooltip
| 方法 | openAutoTooltip([delay, initPoints]); | 数据点提示轮播接口 |
|---|---|---|
| 参数说明 | delay, initPoints | delay 数据点提示的切换时间间隔，默认为 3s initPoints 轮播数据点提示对应的数据点集合，默认为图表内所有数据点 |
| 示例 | var chart =FR.Chart.WebUtils.getChart("A3").getChartWithIndex(0);// 获取单元格图表对象
chart.controller = vanchart.openAutoTooltip();// 开启数据提示轮播，并将轮播控制器绑定到图表对象上点击查看文档：图表开启自动数据点提示轮播接口 | |
| 移动端 | 不支持 | |
dataRefresh
| 方法 | dataRefresh([chartIndex]); | 图表刷新接口 |
|---|---|---|
| 参数说明 | chartIndex | chartIndex 数字型，表示一个图表块中不同的图表对象，从 0 开始计数 |
| 示例 | var chart = FR.Chart.WebUtils.getChart("A3");//获取单元格图表
chart.dataRefresh([1,2]);//刷新图表块的第 2 个和第 3 个图表对象点击查看文档：图表刷新接口 | |
| 移动端 | 支持 | |
showIndexChart
| 方法 | showIndexChart(chartIndex); | 切换到指定图表对象 |
|---|---|---|
| 参数说明 | chartIndex | chartIndex 数字型，表示一个图表块中不同的图表对象，从 0 开始计数 |
| 示例 | FR.Chart.WebUtils.getChart("chart2").showIndexChart(2);点击查看文档：图表切换接口 | |
| 移动端 | 支持 | |
switchCarouselChart()
| 方法 | switchCarouselChart(direction); | 切换到上一个（或下一个）图表对象 |
|---|---|---|
| 参数说明 | direction | direction 表示图表切换的方向：1 表示切换到下一张图表，-1 表示切换到上一张图表，默认为 1 |
| 示例 | FR.Chart.WebUtils.getChart("chart2").showIndexChart(2);点击查看文档：图表切换接口 | |
| 移动端 | 支持 | |
VanCharts.unifiedSwitchCarouselChart()
| 方法 | VanCharts.unifiedSwitchCarouselChart(direction) | 统一切换轮播图表接口 注：该方法中 VanCharts 指的是全局图表对象，无需再获取图表对象 |
|---|---|---|
| 参数说明 | direction | direction 表示图表切换的方向：1 表示切换到下一张图表，-1 表示切换到上一张图表，默认为 1 |
| 示例 | VanCharts.unifiedSwitchCarouselChart(1); 点击查看文档：统一切换轮播图表接口 | |
| 移动端 | 不支持 | |
sortChart
| 方法 | sortChart(sortType); | 图表排序接口 |
|---|---|---|
| 参数说明 | sortType | sortType 表示排序规则，1 表示升序，-1 表示降序 |
| 示例 | var chart = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
chart.sortChart();点击查看文档：图表排序接口 | |
| 移动端 | 不支持 | |
saveAsImage()
| 方法 | saveAsImage(); | 图表导出接口 |
|---|---|---|
| 参数说明 | - | |
| 示例 | var chart = FR.Chart.WebUtils.getChart("A1").getChartWithIndex(0);
chart.saveAsImage(); //导出为图片点击查看文档：图表导出接口 | |
| 移动端 | 不支持 | |
setMapZoom
| 方法 | setMapZoom({zoomLevel: 5, viewCenter: [110, 40]}); | 设置地图缩放等级和中心点 |
|---|---|---|
| 参数说明 | zoomLevel viewCenter | zoomLevel 缩放等级，值区间一般在0-18。数值越大，层级越高，地图显示越细致，显示的经纬度范围越小 viewCenter 中心点，[经度，纬度] |
| 示例 | var chart=FR.Chart.WebUtils.getChart("A1").getChartWithIndex(0);//获取单元格图表对象
chart.setMapZoom({zoomLevel:4, viewCenter: [118,32]});//设置缩放等级为4和中心点的经纬度点击查看文档：地图缩放等级接口 | |
| 移动端 | 不支持 | |
getZoom()
| 方法 | getZoom(); | 获取缩放层级 |
|---|---|---|
| 参数说明 | - | - |
| 示例 | var chart = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0).getZoom();//获取图表对象的缩放层级
alert(chart);//显示缩放层级 | |
| 应用示例 | 例如：点击按钮，获取当前地图的缩放层级
| |
| 移动端 | 不支持 | |
getCenter()
| 方法 | getCenter(); | 获取中心点 |
|---|---|---|
| 参数说明 | - | - |
| 示例 | var center = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0).getCenter();获取图表对象的中心点
alert(center); | |
| 应用示例 | 例如：点击按钮，获取当前地图的中心点
| |
| 移动端 | 不支持 | |
panTo
| 方法 | panTo(center); | 地图转移中心点 |
|---|---|---|
| 参数说明 | center | center 中心点，[纬度，经度] 注：panTo 接口中「纬度」在前，「经度」在后 |
| 示例 | var chart=FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
chart.panTo([40,118]); //根据经纬度移动中心点点击查看文档：JS实现点击按钮转移地图中心点和钻取 | |
| 移动端 | 不支持 | |
drillDown
| 方法 | drillDown(area); | 向下钻取 |
|---|---|---|
| 参数说明 | area | area 不是单纯的区域名，而是区域名下对应的一系列信息，可根据区域名获取到 area |
| 示例 | const name = '江苏省'; // 指定下钻的区域名 let areas = [];chart.series.forEach(ser => areas.push(...ser.points)); // 获取所有区域信息 const area = areas.filter(area => area.name == name)[0]; // 根据区域名获取区域信息 chart.drillDown(area); // 下钻到区域 点击查看文档：JS实现点击按钮转移地图中心点和钻取 | |
| 移动端 | 不支持 | |
drillUp
| 方法 | drillUp(index); | 向上钻取 |
|---|---|---|
| 参数说明 | index | index 不是单纯的区域名，而是区域名上对应的一系列信息，可根据区域名获取到 index |
| 示例 | const name = '江苏省'; // 指定下钻的区域名let areas = []; chart.series.forEach(ser => areas.push(...ser.points)); // 获取所有区域信息 const area = areas.filter(area => area.name == name)[0]; // 根据区域名获取区域信息 chart.drillDown(area); // 下钻到区域 点击查看文档：JS实现点击按钮转移地图中心点和钻取 | |
| 移动端 | 不支持 | |
getLayerIndex()
| 方法 | getLayerIndex(); | 获取当前钻取层级，获取的层级从0开始：0、1、2…… |
|---|---|---|
| 参数说明 | - | |
| 示例 | var chart = FR.Chart.WebUtils.getChart("A1").getChartWithIndex(0);
var names = chart.getLayerNames(); //获取钻取目录层级名
alert(names);点击查看文档：获取钻取地图当前层级接口 | |
| 移动端 | 不支持 | |
getLayerNames()
| 方法 | getLayerNames(); | 获取钻取目录名称，结果为数组，例如：["中国", "湖南省", "长沙市"] |
|---|---|---|
| 参数说明 | - | |
| 示例 | var chart = FR.Chart.WebUtils.getChart("A1").getChartWithIndex(0);
var names = chart.getLayerNames(); //获取钻取目录层级名alert(names);点击查看文档：获取钻取地图当前层级接口 | |
| 移动端 | 不支持 | |
changeParameter
| 方法 | changeParameter({ chartID:'chartID', para: {参数名: 参数值}}) | 改变图表参数重新赋值 |
|---|---|---|
| 参数说明 | chartID | chartID 字符串类型，表示当前图表所在图表块的唯一标识 ID |
| 示例 | 例如要将「华东」作为 area 参数的值传递给 chart1 ：FR.Chart.WebUtils.changeParameter({chartID: 'chart1',para: { area: '华东' }})点击查看文档：自动轮播数据点提示时联动其他图表 、下拉框和图表联动 | |
| 移动端 | 不支持 | |
VanCharts.showLightBox()
| 方法 | showLightBox(chart) | 打开全屏 |
|---|---|---|
| 参数说明 | chart | chart为图表对象 |
| 示例 | 获取图表对象打开全屏
| |
| 移动端 | 不支持 | |
VanCharts.hideFullScreenChart()
| 方法 | VanCharts.hideFullScreenChart() | 关闭全屏 |
|---|---|---|
| 参数说明 | chart | chart为图表对象 |
| 示例 | 获取图表对象关闭全屏 | |
| 移动端 | 不支持 | |
上一篇：图表对象接口
