轮播环形图

  • 社区级协助
  • 文档创建者:mqh
  • 历史版本:5
  • 最近更新:Tracy.Wang 于 2024-08-06
  • 1. 概述

    1.1 版本

    报表服务器版本
    插件版本功能变更
    11.0V1.0.0-

    1.2 应用场景

    在企业年度会议中希望动态展示不同部门的业绩数据,在智慧城市信息平台上希望动态展示各类公共数据等场景。

    轮播环形图插件在集成 Echart环形图 的基础上添加了大屏所需的自动播放系列的功能,给环形图提供了动态效果,丰富了大屏和报表的题材。具体效果如下图所示:

    下载.gif

    1.3 功能描述

    帆软提供「轮播环形图」插件,主要用于动态展示环形图。

    • 支持自定义环形轮播图样式设置和动画效果

    • 不支持移动端

    2. 插件介绍

    2.1 插件安装

    点击下载插件:轮播环形图插件

    设计器插件安装方法参照 设计器插件管理

    服务器安装插件方法参照 服务器插件管理

    2.2 功能入口

    1)普通报表

    选中单元格并调整到合适大小,点击上方工具栏插入图表按钮,插入「轮播环形图」。如下图所示:

    注:也可以在右侧「悬浮元素>添加元素>插入图表」中选择轮播环形图

    806-1712.png

    2)FVS可视化看板

    在 FVS 中添加表格组件。编辑表格,上方工具栏中选择插入图表,在图表类型窗口,选择「轮播环形图」,如下图所示:

    注:FVS,仅支持在「表格组件」中插入轮播环形图使用,不支持直接在「图表组件」中使用轮播环形图

    806-1717.png

    3)决策报表

    在决策报表上方的图表工具栏,选择轮播环形图图标,即可添加,如下图所示:

    注:决策报表,支持在报表块或图表块中使用轮播环形图

    2.3. 图表属性

    2.3.1 数据

    支持数据库数据集,文本数据集,内置数据集,关联数据集等数据集设置。

    数据源填入对应数据来源,选择对应的分类、系列名、值及汇总方式。

    806-1720.png

    2.3.2 样式

    样式属性有五种类型:标题、图形、图例、提示内容、提示样式

    806-1722.png

    具体说明如下表所示:

    样式
    说明
    标题

    设置图表标题的内容和外观效果。

    • 标题可见:是否显示标题组件

    • 文本:主标题文本,支持使用 \n 换行

    • 位置:标题组件的布局位置

    • 样式:标题文本的外观样式,颜色、字体、粗细等

    • 填充:标题背景色

    • 不透明度:背景颜色的透明度值,即 RGBA的 alpha 通道值。例如  'rgba(128, 128, 128, 0.5)'

    • 圆角:圆角半径,单位 px

    806-1724.png
    图形

    设置图形的外观样式效果。

    • 配色方案:调色盘颜色列表。依次循环从该列表中取颜色作为系列颜色

    • 填充:标题背景色

    • 不透明度:背景颜色的透明度值

    • 扇区顺时针排布:饼图的扇区是否是顺时针排布

    • 系列数据升序:升序排列系列数据值

    • 半径:饼图半径值大小

    • 内径:内半径设大显示成圆环图

    • 线型:扇区图形边框粗细值

    • 颜色:扇区图形边框颜色。

    806-1727.png
    图例

    可设置图例的外观样式效果。

    • 图例可见:是否显示图例

    • 位置:图例组件离容器布局位置

    • 朝向:图例列表的布局朝向

    • 字符:图例的样式,文本的外观样式,颜色、字体、粗细等

    • 线型:图例的边框线宽

    • 颜色:图例的边框颜色

    • 圆角:图例的边框圆角半径

    • 填充:图例背景色

    • 不透明度:图例背景颜色的透明度值

    806-1730.png
    提示内容

    可设置饼图图形上的文本标签外观样式效果。

    • 格式器:标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 \n 换行。详细参考 格式器

    • 位置:标签的位置,可设置为图内、图中、图外

    806-1732.png
    提示样式

    可设置饼图高亮状态的扇区和标签样式。

    • 放大效果:是否开启高亮后扇区的放大效果

    • 线型:高亮扇区的边框线宽

    • 颜色:高亮扇区的边框颜色

    • 字符:标签的样式,文本的外观样式,颜色、字体、粗细等

    • 线型:标签的边框线宽

    • 颜色:标签的边框颜色

    • 圆角:标签的边框圆角半径

    • 填充:标签背景色

    • 不透明度:背景颜色的透明度值

    • 模式:选中模式的配置,表示是否支持多个选中

    • 扇区偏移:选中扇区的偏移距离

    806-1733.png

    2.3.3 特效

    806-1807.png

    1)动画参数

    • 动画:支持三种动画类型。无动画、渐变动画、自定义动画。

    • 间隔:动画间隔时间。

    • 是否永久动画:勾选后,鼠标点击扇区或图形时,不会中止动画播放。

    • 自定义动画-旋转:控制图表扇区角度,实现扇区按照指定方向旋转效果。

    注:「自定义动画-旋转」设置仅在动画选择「自定义动画」时出现

    2)刷新

    定时刷新:按照时间间隔,图表数据定时更新数据。定时刷新时,当前正在动画扇区会播放动画结束,不停止。

    3)超级链接

    超级链接:图表可添加链接,实现鼠标双击打开链接页面效果。

    3. 示例

    3.1 新建图表

    1)新建一张普通报表。

    2)将单元格调整到合适大小,选中单元格。

    3)点击上方工具栏插入图表按钮,插入「轮播环形图」。

    806-1712.png

    3.2 设置图表属性

    1)数据

    • 设置数据来源为「数据集数据」,数据集为内置数据集「用户信息表」

    • 分类为「position」,值为「username」,汇总方式为「个数」

    806-1905.png

    2)样式

    样式设置
    图示

    标题

    • 内容:文本为「职位占比图」

    • 字符:字体大小为 12,颜色为 白色,加粗

    • 背景:填充选择黑色,不透明度为 49%,圆角为 5 px

    806-1840.png

    图形

    默认设置即可

    -

    图例

    • 布局:位置选择「靠下」朝向选择「水平」

    • 样式默认设置即可

    • 边框:设置线型、颜色以及圆角为 5 px

    • 背景默认设置即可

    806-1844.png

    提示内容

    默认设置即可

    -

    提示样式

    默认设置即可

    -

    3)特效

    具体设置见 3.3 节。

    3.3 效果预览

    特效设置中不同动画的效果如下表所示:

    动画
    效果
    无动画
    806-1830.png
    渐变动画渐变动画.gif
    自定义动画

    高亮放大效果

    属性设置:

    样式>提示样式>放大尺寸为 20

    样式>系列>选中>扇区偏移值 0

    特效>自定义动画>旋转>关闭


    自定义动画-无旋转.gif

    旋转效果

    属性设置:

    样式>提示样式>放大尺寸为 0

    样式>系列>选中>扇区偏移值 0

    特效>自定义动画>旋转>顺时针


    自定义动画-旋转-无放大.gif

    选中效果

    属性设置:

    样式>提示样式>放大尺寸为 0

    样式>系列>选中>扇区偏移值 20

    特效>自定义动画>旋转>关闭


    自定义动画-选中.gif

    高亮放大 + 旋转效果

    属性设置:

    样式>提示样式>放大尺寸为 20

    样式>系列>选中>扇区偏移值 0

    特效>自定义动画>旋转>顺时针


    自定义动画-放大-旋转.gif

    选中 + 旋转效果

    属性设置:

    样式>提示样式>放大尺寸为 0

    样式>系列>选中>扇区偏移值 20

    特效>自定义动画>旋转>顺时针


    自定义动画-选中-旋转.gif

     注:不支持移动端。

    4. 模板下载

    点击下载模板:轮播环形图.cpt

    附件列表


    主题:
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

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

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

    不再提示

    10s后关闭



    AI

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

    反馈已提交

    网络繁忙