第48页,共417页。 显示 4,170 条结果 (0.052 秒)
Echarts图形-扩展属性:仪表盘双y联合图中柱图被曲线面积图遮挡
(本文档仅供参考) 问题说明 如下图所示,仪表盘中双y联合图中,使用曲线面积图和柱图时,曲线面积图默认会覆盖在柱图上,影响柱图的展示,以及影响柱图上的跳转、筛选等功能。 image2024-2-6_19-15-27.png 解决方案 目前产品中没有直接的设置项可以进行层级的调整,不过可以通过扩展属性或者宏的方式来讲柱图置于曲线面积图之上。 1、通过扩展属性的方式实现 与Echarts图形-扩展属性:联合图柱图显示上方,面积图显示在下方一致, { "series": [{ "zlevel": 0 }, { "zlevel": 1 }] } 不过需要注意图形的层级应该与图形保持一致,如下图所示ECharts图形-高级
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 属性说明 设置图形的具体名称。 image2019-11-27 10:57:1.png 预览效果 先设置图形标识为“横条图123”,再设置跳转规则的时候,选择 图形,则可以在“图形”查找已有图形标识的图形。 image2019-11-27 11:15:53.png {html}<div style="border-bottomECharts图形-高级
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} 属性说明 设置图形的具体名称。 image2019-11-27 10:57:1.png 预览效果 先设置图形标识为“横条图123”,再设置跳转规则的时候,选择 图形,则可以在“图形”查找已有图形标识的图形。 image2019-11-27 11:15:53.png {html}<div style="border-bottomEcharts图形-扩展属性:样式 - 环形图内阴影外阴影的背景实现效果
{ zlevel: 3, }, // 内圆 { type: 'pie', zlevel: 2, // 层级 radius: ['0', '47%'], //根据实际调整半径大小 center: ['50%', '55%'],//根据实际调整中心位置 … ] }, // 外环 { type: 'pie', zlevel: 2, radius: ['60%', '80%'],//根据实际调整半径大小 center: ['50%', '55%'],//根据实际调整中心位置 itemStyle跳转 - 电子表格如何实现点击echarts图形跳转传递非XY轴数据
中去。但是看了下报表本身的跳转规则功能,也只能获取到作图的XY轴和参数信息,即便将对应的区域字段作为图形提示字段,在跳转规则那边也选择不到。是否有其他方案可以实现该效果? 解决方案 该问题解决方法,请参考如下步骤: 第一步:在“插入图表”对话框上,必须把要传递到目标报表的字段添加到“数据设置”中(图形上可以不使用它,也必须添加进来),如下图: image2025-3-29_11-33-48.png 第二步:正常在图形配置跳转规则。在选择目标报表的“参数来源”时,下拉框中随便选个一个字段即可。如下Echarts图形-扩展属性:修改图例大小不修改文字大小
(本文档仅供参考) 问题 如何修改图例大小,图例旁边的文字不修改大小 2022-06-06_173511.png 解决方案 通过图例-文字样式可以修改图例图形和文字的大小。 2022-06-06_173945d.png 若希望只修改图例的图形大小,可以使用扩展属性实现 { legend: { itemWidth: 40, //调节横线长短 itemHeight: 19 //调节圆圈大小 } } 效果如下: image_1654505612749_fmdgm.png 扩展:自助仪表盘中的自定义属性 { "legend": { "itemWidth": 50Echarts图形-扩展属性:数据标签 - 关系图的连线上显示关系信息
": true, "formatter": "function(x){ return x.name+':'+x.value;}", //连线显示关系 } } }] } PS: x.name 和x.value 是固定图形方法属性,如果需要调出更多当前图形相关的方法属性,可以增加debugger 进入前端调试获取。 image2024-5-24_14-10-37.png 关系图连接线的数据标签不显示Echarts图形-扩展属性:数据标签 - 柱图数据标签重叠问题
(本文档仅供参考) 问题 当柱图系列较多,数值较大且相近时,容易出现数据标签重叠的现象,如下图所示: image2021-4-25_10-41-38.png 如何实现每个系列中的数据标签可以依次往上偏移,实现数据标签不重叠? 解决方案 可通过扩展属性调整每个柱子的数据标签位置,扩展属性如下 … 图: image2021-4-25_10-51-4.png 显示效果如下图: image2021-4-25_11-10-12.png 说明:使用此扩展属性,数据标签的值会与y轴的值不对应,此扩展属性是移动数据标签的位置。 注:使用此扩展属性实现的是对固定多系列柱Echarts图形-扩展属性:样式 - 环形图设置进度条效果(基于油量图)
修改后: image2022-2-18_10-52-40.png 效果如下: image2022-2-18_10-52-58.png 4、修改指标名称位置 如果需要修改【CPU占用率】这个指标名称的位置,可以在组件设置中对【标题】进行设置 image2022-2-18_10-55-11.pngEcharts图形-扩展属性:x/y轴标签换行
(仅供参考) 问题1: 自助仪表盘柱图x轴名称能否换行显示 解决方案: 自助仪表盘图形柱图组件,组件设置,自定义属性,将编辑框里的属性代码删除掉,黏贴以下代码。(注:在代码正确合理时,会自动将我们自己写的代码合并到原有的代码里) { "xAxis": { "axisLabel … =v2 解决方案: 右键点击组件样式,在图形属性配置代码中加入如下扩展属性: { "xAxis": { "axisLabel": { "align": 'left', "padding": [0, 0, 0