反馈已提交

网络繁忙

图表图例

  • 文档创建者:Holly
  • 编辑次数:28次
  • 最近更新:Alicehyy 于 2021-10-25
  • 1. 概述

    1.1 版本

    报表服务器版本
    11.0

    1.2 功能简介

    「图例」显示的内容实际是由 图表系列>颜色 决定的,共有以下三种类型:

    注:框架图和仪表盘不支持设置图例。

    1)普通图例:可点击图例实现该系列的显示与隐藏。

    Snag_9f672bb.png

    2)连续渐变图例:可滑动上下圆点改变值的范围,图形对应的值在范围内时显示,在范围外时隐藏。

    Snag_9fd54b2.png

    3)区域段图例:可点击区域段实现该区域段对应的图形的显示与隐藏。

    Snag_a201a7d.png


    注:只有「地图、钻取地图、热力地图、气泡图、散点图、词云图」这 6 种图表的系列选择为「颜色划分>值」时可设置后两种图例,其他情况均为普通图例。

    2. 属性介绍

    图例共有 5 个通用属性,分别是:布局、样式、边框、背景、显示策略。当图表为「地图、钻取地图、热力地图、气泡图、散点图、词云图」且设置 图表系列颜色划分 为「值」时,图例会显示「格式」属性。下面为大家分别介绍。

    2.1 布局

    图例显示位置设置,共有六个设置选项,分别是:靠上,靠下,靠左,靠右,右上、自定义悬浮位置,默认为靠右显示。

    1590656204796715.png

    1)靠上,靠下

    位置选择「靠上、靠下」时,会显示「排列」选项:流式、对齐,默认为对齐。

    1590656628283931.png

    当图表的图例较多时,流式布局和对齐布局的效果分别如下所示:

    1591855226519515.png

    2)靠左、靠右、右上

    位置选择「靠左、靠右、右上」时,无排列选项。如下图所示:

    1590656820904201.png

    3)自定义悬浮位置

    通过输入 x 方向和 y 方向的值来控制图例的位置。

    详细介绍和示例参见文档:自定义图表标题和图例的位置 。

    1590657078479370.png

    2.2 样式

    用于设置图例标签文字的字体、颜色、字号,默认跟随主题,可根据具体需求自定义。

    注:如果浏览器设置了最小字体,而模板图表中设置的最小字体小于浏览器的最小字体,那么以浏览器为准。

    比如说 Chrome 浏览器的最小字体为 12 号,图表设置的字体大小为 10 号,在 Chrome 下查看报表时,图表字体显示为 12 号,而非 10 号,故此时需要修改浏览器字体大小。

    2.3 边框

    可设置整个图例部分的边框,默认为无边框。设置项如下:

    • 线型:图例边框采用哪种线型,默认为无。

    • 颜色:图例边框所使用的颜色。

    • 圆角:图例边框四个角的圆角度数设置,默认为 0 px。

    Snag_52dd6ac.png

    2.4 背景

    可设置整个图例部分的背景,默认没有背景。设置项如下:

    • 填充:可下拉选择没有背景、颜色、渐变色,默认为没有背景。

    • 不透明度:设置背景的透明效果,默认不透明度为 100% 。

    • 阴影:设置图表背景是否开启阴影效果,默认为关闭。

    Snag_52c6ad7.png

    2.5 显示策略

    可设置图例在整个图表的所占的区域大小,以及图例在预览时的交互效果。

    1)区域大小:可对图例显示区域的大小进行控制,可选择「自动」和「自定义」,默认为「自动」即不限制大小。

    注:图例的布局设置为自定义悬浮位置时,区域大小灰化不可设置。

    2)固定显示:开启与不开启固定显示的交互效果不同,默认为勾选开启固定显示。

    注:不支持多层饼图、热力地图及系列颜色「连续渐变」形态下图表,系列颜色为「区域渐变」时,固定显示效果和 2.5.1 节普通图例效果一致。

    Snag_533f09.png

    2.5.1 交互效果

    1)未开启固定显示

    初次点击图例文字或图标,该图例隐藏,再次点击后显示。效果如下图所示:

    1626851444776655.gif

    2)开启固定显示

    • 当图例显示时,将鼠标悬浮在图例上时,图例图标变为「固钉」样式 Snag_6c06b38.png(颜色跟随系列色),且当鼠标悬浮在图例图标上时,该图例高亮,高亮的图例对应的系列不透明度为 100%,其余系列不透明度为 30%。

    Snag_a8e2cc6.pngSnag_a8f54fa.png

    • 图例显示时,点击图例文字,该图例隐藏,隐藏后点击图例文字或图标则再次显示;

    • 图例显示时,点击 Snag_a47a124.png 后图标变为 Snag_a479155.png ,此时只显示该图例,其他图例隐藏;点击被隐藏的图例,可再次显示。当只有一个系列显示时,点击 Snag_a479155.png 后,所有系列显示。

    96565965-FA89-41AE-9D21-A652D0666411.GIF

    2.6 格式

    当图表为地图、钻取地图、热力地图、气泡图、散点图、词云图时,设置 图表系列颜色划分 为「值」时,图例会显示「格式」设置项。

    1)标签格式为「通用」时,图例显示格式随下拉框中所选设置改变,效果如下图所示:

    1605667303234534.png

    2)标签格式为「自定义」时,可通过输入 JavaScript 代码,使用 HTML 解析文本内容,实现图例自定义格式。详情可参见:图表使用 HTML 解析文本内容 。

     1605666925987737.png

    附件列表


    主题: 图表应用
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    在线QQ:800049425

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

    总裁办24H投诉

    热线电话:173-1278-1526

    文 档反 馈

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

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

    不再提示

    10s后关闭