反馈已提交

网络繁忙

当前为10.0版本文档,只有最新版本的文档支持在线编辑修改,如果想创建/编辑文档,请移步至 最新版帮助文档

图表入门示例

  • 文档创建者:文档助手1
  • 历史版本:33
  • 最近更新:Leo.Tsai 于 2021-12-03
  • 1. 概述

    本文以 单元格元素图表 分别使用 单元格数据数据集数据 作为数据来源,简单讲解如何制作图表。

    在线视频学习请查看:图表入门示例 。

    2. 示例

    2.1 预期效果

    示例效果如下所示:

    • 左上角为所有销售员的产品销量统计表。

    • 右上角为每个地区下销售员的销量柱形统计图。

    • 下方为所有销售员的销量饼状统计图。

    1567473109647373.png

    2.2 数据准备

    新建普通报表,新建数据库查询 ds1,SQL 查询语句:SELECT * FROM 销量,取出销量表中的所有数据。

    Snag_43696e5.png

    2.3 报表设计

    2.3.1 销量统计表设计

    1)A1~C1 单元格写入表格标题信息,选中 A1~C1 单元格,右边属性面板选择「单元格属性>样式」,样式下拉框选择「预定义样式」,给标题设置一个 Head 类型的样式。

    注:设置好 Head 类型的样式后,标题字体会自动居中,无需另外设置。

    1567474662834313.png

    2)将数据集中的字段拖入到对应单元格中,选中 A2~C2 单元格,将字体居中,选中 A1~C2 单元格,给表格整体添加内外框。

    1567475266843232.png

    3)选中 C2 单元格,右边属性面板选择「单元格元素>基本」。数据设置下拉框选择「汇总>求和」。

    1567475500955390.png

    至此,表格式数据设计工作已经完成,下面插入图表。

    2.3.2 插入柱形图

    1)合并 D1~G1 单元格,写入标题信息「柱形统计图」,字体居中。合并 D2~G2 单元格,作为柱形图插入位置。给合并后的单元格添加内外框。

    1567476635841430.png

    2)选中合并后的单元格 D2,点击「插入图表」快捷按钮,图表类型选择「柱形图>柱形图」。

    1567481874987890.png

    3)选中柱形图所在单元格 D2,右边属性面板选择「单元格元素>数据」。数据来源下拉框选择「单元格数据」。

    点击分类名右侧的 F(x) 按钮,公式面板中输入B2,让销售员字段作为柱形图的分类名。

    点击系列名和值设置项下方的Snag_14bbc0f9.png,新增一条系列名和值的设置项,点击系列名右侧的公式按钮,公式面板中输入「销量」,点击值右侧的公式按钮,公式面板中输入C2,让销量作为系列名,销量字段的数据作为系列的值。

    注:分类名、系列名、值的内容也可以直接在编辑框中输入。以分类名为例,直接在分类名右侧编辑框中输入「=B2」,等号是必须的,千万不要忘记。

    1567477812141424.png

    4)由于D1单元格已经设置了柱形图的标题,所以柱形图自己的标题无需设置,直接去掉即可。

    选中柱形图所在单元格 D2,右边属性面板选择「单元格元素>样式>标题」,「标题可见」默认是勾选的状态,这里将勾选取消。

    1567479006105096.png

    5)报表预览时,考虑到美观性,将图表工具栏去掉。

    选中柱形图所在单元格 D2,右边属性面板选择「单元格元素>特效>交互属性>工具栏>内容」。将默认勾选的排序、导出图片、全屏展示取消勾选即可。

    1567479542169088.png

    6)设置柱形图跟随地区字段扩展(A2 单元格),让每个地区下只有一个柱形统计图。

    选中柱形图所在单元格 D2,右边属性面板选择「单元格属性>扩展」。扩展方向选择「不扩展」,自定义左父格为 A2 单元格。

    1567480071916686.png

    2.3.3 插入饼图

    1)合并 A3~G25 单元格,作为饼图插入位置。给合并后的单元格添加内外框。

    1567481336632793.png

    2)选中合并后的单元格 A3,点击「插入图表」快捷按钮,图表类型选择「饼图>饼图」。

    1567481618650226.png

    3)选中饼图所在单元格 A3,右边属性面板选择「单元格元素>数据」。数据来源选择「数据集数据」,数据集选择 ds1。分类选择「无」,系列名使用选择「字段值」,系列名选择「销售员」,值选择「销量」,汇总方式选择「求和」。

    Snag_19b8f4b7.png

    4)选中饼图所在单元格 A3,右边属性面板选择「单元格元素>样式>标题」,勾选「标题可见」,设置标题文本内容为「饼状统计图」,位置「靠右」。

    1567482809559778.png

    5)去掉图表展示时的工具栏。选中饼图所在单元格 A3,右边属性面板选择「单元格元素>特效>交互属性>工具栏>内容」。将默认勾选的排序、导出图片、全屏展示取消勾选即可。

    1567483191255148.png

    2.4 效果预览

    2.4.1 PC 端

    保存报表,点击「分页预览」,效果如下图所示:

    1567473109647373.png

    2.4.2 移动端

    移动端查看报表的方式参见 报表移动端预览

    1567510543193976.jpg

    3. 模板下载

    已完成模板可参见:%FR_HOME%\webroot\WEB-INF\reportlets\demo\NewbieGuide\图表入门.cpt

    点击下载模板:图表入门.cpt

    附件列表


    主题: 图表应用
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

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

    总裁办24H投诉

    热线电话:173-1278-1526