第24页，共417页。 显示 4,167 条结果 (0.028 秒)
指标组件 ⬝ 油量图
1 概述 油量图是指以油量表的形式来展现指标数据。有一个圆形的表盘及相应的刻度，刻度表示数值的范围，有一个指针指向当前数值，可直观的表现出某个指标的进度或实际情况。以下将分别举例油量图、内刻度油量图和外刻度油量图三种图的画法。 2 图形效果 油量图 外刻度油量图 内刻度油量图 youliangtuxiaoguo-01.png 2021-11-15_15-26-39.png youliangtuxiaoguo-02.png 内刻度油量图和外刻度油量图是油量图的不同展现形式，可根据实际应用场景及样式要求进行选择，下面以油量图为例，详细说明创建过程： 3 油量图 3.1 基础新移动端-轮播图
轮播图即banner，它通常以轮播的形式展现，用于展现不同的信息，支持手动切换。 轮播图在手机和平板中的效果如下： 手机 平板 image2019-10-14 11:41:35.png image2019-10-14 11:39:37.png 实现说明 轮播图展现的资源是通过指定资源目录而得，将该目录下的资源轮播展现；支持的资源类型有：电子表格、页面、Web链接、分析报告。 目前资源展现的形式支持“图片”或“电子表格报表”两种类型： 图片：显示报表上传的移动端缩略图。该类型必须结合“轮播图下钻”功能使用；所有资源都支持以该类型展现。 电子表格报表：展现的是报表实现堆积柱图+线图
实现联合图是堆积柱图+线图的效果？现在是效果如下： 堆积线.png 思路 1）设置好联合柱图，如下： 堆积线2.png 2）新建客户端模块： image2022-11-8_15-10-7.png image2017-6-30 14:57:53.png 3）具体宏代码如下： function … } } } } 4）最终效果图： 堆积线3.png 示例资源：实现堆积柱图+线图.xml 联合图 堆积图线图实现堆积柱图+线图
实现联合图是堆积柱图+线图的效果？现在是效果如下： 堆积线.png 思路 1）设置好联合柱图，如下： 堆积线2.png 2）新建客户端模块： image2022-11-8_15-10-7.png image2017-6-30 14:57:53.png 3）具体宏代码如下： function … } } } } 4）最终效果图： 堆积线3.png 示例资源：实现堆积柱图+线图.xml 联合图 堆积图线图指标组件 ⬝ 进度图
1 概述 进度图可直观展示某指标的进度，使仪表盘拥有更多视觉效果。以下将分别举例进度图和环形进度图两种图的画法。 2 进度图 2.1 指标完成情况 1、场景描述：某大型零售公司，想要查看当前销售额相对原定销售目标的完成情况，效果如下图所示： jindutuxiaoguo-01.png 2、以产品内置Demo资源的“订单模型”作为数据来源。 3、操作步骤 （1）添加进度图组件，在数据选择区中，勾拖拽 销售额 字段到 指标 ， 销售目标 字段到 提示 。 jindutuxiaoguo-02.png （2）在组件属性设置中，设置 目标值 ，选择 自定义 ，并选择 销售目标 字段，如下图所示ECharts图形-联合图
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 联合图是指以线图、柱图、面积图或者散点图任意两两组合（双线图、双柱图、双面积图、双散点图亦包含在内）的表现形式来展现两个或两个以上数据指标情况。 ECharts图形支持如下两种类型的联合图： 单Y轴联合图：只有一个Ｙ轴的联合图。 双Y轴联合图：有两个Ｙ轴的联合图。 单Y联合图 双Y联合图 优势： 可在同一页面用不同的图进行分析对比ECharts图形-联合图
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 联合图是指以线图、柱图、面积图或者散点图任意两两组合（双线图、双柱图、双面积图、双散点图亦包含在内）的表现形式来展现两个或两个以上数据指标情况。 ECharts图形支持如下两种类型的联合图： 单Y轴联合图：只有一个Ｙ轴的联合图。 双Y轴联合图：有两个Ｙ轴的联合图。 单Y联合图 双Y联合图 优势： 可在同一页面用不同的图进行分析对比ECharts图形-雷达图
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 雷达图又称戴布拉图或蜘蛛网图，它从一个中心点向外辐射出多条坐标轴（4条以上），每一个分类数据都占有一条数值坐标轴，并连接各坐标轴上同一系列的值构成一个个不规则多边形。在任何一个轴上靠近图形中心的点表示一个较低的数值，靠近图形边缘的点表示一个较高的数值。 雷达图通常用于在同一组坐标轴上比较不同实体的性能，也可用于表示和同一个项目相关的多个不同的因素。 优势ECharts图形-雷达图
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 雷达图又称戴布拉图或蜘蛛网图，它从一个中心点向外辐射出多条坐标轴（4条以上），每一个分类数据都占有一条数值坐标轴，并连接各坐标轴上同一系列的值构成一个个不规则多边形。在任何一个轴上靠近图形中心的点表示一个较低的数值，靠近图形边缘的点表示一个较高的数值。 雷达图通常用于在同一组坐标轴上比较不同实体的性能，也可用于表示和同一个项目相关的多个不同的因素。 优势Echarts图形-扩展属性：鼠标提示 - 柱图鼠标提示换行显示
（本文档仅供参考） 问题 如何实现柱图鼠标提示换行显示？ 解决方案 可以用以下扩展属性实现： { "tooltip": { "formatter": "function(a){ debugger;return a.seriesName+'</br>'+a.name+'</br>'+a.data.value[1]}" } } 效果图如下： image2018-11-5 14:39:56.png 鼠标提示换行
