反馈已提交

网络繁忙

图表块

  • 文档创建者:文档助手1
  • 编辑次数:20次
  • 最近更新:Alicehyy 于 2021-11-29
  • 1. 概述

    1.1 版本

    报表服务器版本
    11.0

    1.2 应用场景

    在制作决策报表时,图表可谓是主力军,是大屏中数据可视化的主要部分。

    我们可以将独立的图表块直接拖入 body 中,也可以在报表块的单元格中插入图表,但不支持插入 悬浮元素图表

    本文将简单介绍图表块的使用方式及注意事项。

    2. 图表块

    2.1 添加图表块

    1)点击设计器左上角「文件>新建决策报表」,在弹出的对话框中选择「新建空白模板」后点击「确定」进入新建的模板。

    2)直接将图表块拖入 body 即可。拖入的图表块名称默认为 chart+数字,数字从 0 开始累加。

    92489FBA-F0DC-4F2B-912C-5C5F3E7D4E19.GIF

    2.2 组件样式

    图表块组件属性默认如下图所示,具体样式设置请参考 组件样式 。

    Snag_adaa7f.png

    图表内容的各项设置,例如图表数据、图表样式、图表特效等等,请参考 图表简介 。

    3. 移动端说明

    3.1 内边距导致图表大小不一致

    问题描述

    body 「自适应布局」下,两个图表块大小一致,如下图所示:

    Snag_b9f5c6.png

    在 PC 端预览时,chart1 与 chart2 的饼图大小是一样的,然而在移动端或 HTML5 下预览时,两个饼图的大小是不一致的,如下图所示:
    Snag_d62818.png

    原因分析

    原因在于 body 设置了内边距的「左内边距」,设计器的自适应会将左内边距计入相邻的组件宽度。

    Snag_d3ef4f.png

    解决方法

    解决方法有三种:

    1)取消设置模板内边距的左边距,并且调整 chart1 与 chart2 的尺寸宽高一致;

    2)由于 chart1、chart2 均为饼图,可以设置饼图的「样式>系列>半径」为相等的固定值,如下图所示:
    Snag_d8cd09.png

    3)通过调整控件大小实现,只要边距加上相邻组件的宽度跟期望等宽的组件宽度相等,即左内边距加上 chart1 的宽度等于 chart2 的宽度。

    修改后,App 与 HTML5 预览,饼图大小是一致的,如下图所示:

    Snag_e0d5fb.png

    附件列表


    主题: 决策报表应用
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    在线QQ:800049425

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526

    文 档反 馈

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

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

    不再提示

    10s后关闭