反馈已提交

网络繁忙

图表特效接口

  • 文档创建者:Alicehyy
  • 历史版本:28
  • 最近更新:Tracy.Wang 于 2024-06-05
  • 版本

    报表服务器版本功能变动
    11.0.2

    新增接口:

    • chart.getLayerIndex(); //获取钻取地图当前层级

    • chart.getLayerNames(); //获取钻取地图目录名称

    • chart.saveAsImage(); //图表导出为图片

    • chart.drillUp(index); // 向上钻取

    1)本文汇总的接口适用于 FineReport 所有的基础图表,且普通报表、决策报表、聚合报表均可以使用。

    2)部分接口支持 11.0.63 及之后版本的移动端。

    3)所有图表接口,均需在获取图表对象之后使用,获取图表对象接口可参考:图表对象接口

    4)扩展图表 除 场景地图 有两个接口外,其他扩展图表均无接口可供前端开发使用。

    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]);图表刷新接口
    参数说明chartIndexchartIndex 数字型,表示一个图表块中不同的图表对象,从 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 指的是全局图表对象,无需再获取图表对象

    参数说明directiondirection 表示图表切换的方向:1 表示切换到下一张图表,-1 表示切换到上一张图表,默认为 1
    示例
    VanCharts.unifiedSwitchCarouselChart(1);

    点击查看文档:统一切换轮播图表接口

    移动端不支持

    sortChart

    方法
    sortChart(sortType);图表排序接口
    参数说明sortTypesortType 表示排序规则,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);//显示缩放层级
    应用示例

    例如:点击按钮,获取当前地图的缩放层级

    level.gif

    移动端不支持

    getCenter()

    方法
    getCenter(); 获取中心点
    参数说明--
    示例
    var center = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0).getCenter();获取图表对象的中心点
    alert(center);
    应用示例

    例如:点击按钮,获取当前地图的中心点

    center.gif

    移动端不支持

    panTo

    方法
    panTo(center);地图转移中心点
    参数说明center

    center 中心点,[纬度,经度]

     注:panTo 接口中「纬度」在前,「经度」在后

    示例
    var chart=FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
    chart.panTo([40,118]); //根据经纬度移动中心点

    点击查看文档:JS实现点击按钮转移地图中心点和钻取 

    移动端不支持

    drillDown

    方法

    drillDown(area);

     向下钻取
    参数说明areaarea 不是单纯的区域名,而是区域名下对应的一系列信息,可根据区域名获取到 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); 

    向上钻取
    参数说明indexindex 不是单纯的区域名,而是区域名上对应的一系列信息,可根据区域名获取到 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)打开全屏
    参数说明chartchart为图表对象
    示例

    获取图表对象打开全屏

    var chart1 = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
    VanCharts.showLightBox(chart1);

    all.gif

    移动端不支持

    VanCharts.hideFullScreenChart() 

    方法VanCharts.hideFullScreenChart() 关闭全屏
    参数说明chartchart为图表对象
    示例

    获取图表对象关闭全屏

    var chart1 = FR.Chart.WebUtils.getChart("chart0").getChartWithIndex(0);
    VanCharts.hideFullScreenChart(chart1);
    移动端不支持


    附件列表


    主题: 二次开发
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭



    AI

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持