产品文档

京东莫奈可视化平台

2023-12-12 08:00:22

轮播环形图1

适用场景:在使用环形图时同时希望加入凸显每一块大小的动画。轮播支持以轮播的方式展示各类别的占比或数值,支持自定义展示百分比值或实际数值,能够更加形象智地在大屏中展示数据的占比或变化情况。

样式设置

20200915130642.png

当前轮播环形图1的样式设置可设置圆环设置,提示框设置,动画设置,图例设置,图标位置,图表尺寸。

圆环设置

1593590460(1).png

圆环设置包括设置圆环的内环占比,设置圆环有无间隙及间隙大小。

颜色设置包括:默认填充颜色和选中填充颜色

默认填充颜色:此功能为设置轮播环形图1中各个扇区的颜色,如果轮播环形图1共有6个扇区,但此处只设置两种颜色,则会在显示颜色时按照数据的顺序循环展示;默认有六个颜色,如果需要增加颜色,可以在填充颜色下第一个颜色右边点击加号增加颜色,如下图所示:

1593590744(1).png

如果要删除颜色,可以在除第一行颜色外,其它颜色右方点击删除删掉删除键所在颜色。

选中填充颜色:在预览时,选中相应的区域后,相应区域显示的颜色,开启后进入预览界面,我们可以看一下效果,效果图如下面两个图所示:左图为未选中填充颜色时的状态:轮播到对应区域时显示的是扇形区域设置的颜色;右图为选中填充颜色后的效果:当轮播到相应区域时,相应区域显示的颜色为设置的选中填充颜色。

中心点位置

此功能为设置环形图的中心点距离图表上边界和左边界的位置。

文本设置

维度文本:显示或不显示

数值文本:可以设置,显示数值,显示百分比,显示数值+百分比以及不显示四种,如下图所示:

20200519180923.png

保留小数:数值文本会出现小数形式,这里可以设置0-3位小数

文本格式:可以选择换行,不换行

文本样式:可以自定义设置字体,字号,粗细以及颜色,也可以采用系统默认样式。

提示框设置

1593591241(1).png

提示框设置中,可以对提示框的文本设置,包括字体,字号,粗细和颜色

还可以设置提示框背景颜色,提示框圆角设置,边框粗细颜色以及选中的颜色。

动画设置

可以设置循环播放或者播放一次后停止,以及设置每个扇形区域的停留时间,如下图所示:

20200519180858.png

图例设置

图例设置可以对是否显示图例,以及所显示图例的文本和布局进行设置。

文本:支持字体,字号,字体颜色以及字体粗细的修改。

布局:可以对图例的位置进行设置。

目前默认支持:顶部,底部,左侧,右侧的居左居中居右的设置,如下图所示:

支持自行设置图例位置:通过调整左右间距,和上下间距进行自主设置。

20200519171159.png

20200519171224.png

图表位置

图表位置为图表左上角的位置坐标,通过横坐标和总左边的设置即可设置对应的图表位置。也可以通过选中图形后用鼠标拖曳到相应位置的方式设置图表位置。

20200519163440.png

图表尺寸

即显示的轮播环形图的宽和高,通过设置相应的数字,调节轮播环形图的大小。

20200519163556.png

数据设置

数据字段

20200915130740.png

轮播环形图1数据字段包括:name,value

name:数据代表的内容,即环形图的图例所示内容名称,需要将数据与图表进行映射;

value:各个图例下具体的数据的值,需要将数据与图表进行映射;

数据源类型

支持静态数据,API和数据库三种类型。操作流程图整体如下所示:

20200519164336.png

静态数据:

1597659394(1).png

在下方表格中可输入或复制粘贴所需要的数据。其中,每一列数据对应一个数据字段,第一行为该列数据字段名,需要在上方进行映射设置。

目前,数据接入表格支持复制、粘贴、修改、删除数据。选中需要进行改动的数据后,可以点击右键进行操作,也可以使用ctrl+c等快捷键进行操作。当点击列序号或行序号是,会对该列或行全部选中,点击末尾的红色按钮可对该行或列进行删除操作,也可以点击右键对该行或列进行其他操作。

当点击红框内的放大按钮时,会出现如下图所示的输入窗口,方便用户进行操作。

55.png

在窗口中设置数据后,点击完成即可

点击下方的高级输入,可以切换到输入json格式数据模式。json数据样例如下。

[{"type":"工作","number":15121},{"type":"旅游","number":20212},{"type":"生活","number":25123},{"type":"留学","number":19000},{"type":"探亲","number":1910}]

API

在下方输入框中输入相应的网址即可,如下图所示:

20200519164415.png

数据库

选取相应的数据库类型后,选择对应数据库中的数据源名称。之后在下方输入框中输入简单的SQL语句即可实现数据的导入,之后查询数据响应结果,无误后确认设置即可。

20200519164444.png

文档反馈

开始与售前顾问沟通

可直接拨打电话 400-098-8505转1

我们的产品专家为您找到最合适的产品/解决⽅案

在线咨询 5*8⼩时

1v1线上咨询获取售前专业咨询

点击咨询
企微服务助手

专业产品顾问,随时随地沟通