找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,极速登录

仪表盘自定义标签目标值

我是社区第504714位番薯,欢迎点我头像关注我哦~

1. 概述

10.0.16 版本之前的设计器中,百分比圆环仪表盘、百分比刻度槽仪表盘和试管型仪表盘的「值标签」不支持显示「目标值」,但可以通过自定义实现:

实现效果如下图所示:

2. 示例2.1 准备数据

新建普通报表,新建内置数据集,表设计如下图所示:

2.2 插入图表

在表格中合并三块单元格区域,分别插入图表:百分比圆环仪表盘、百分比刻度槽型仪表盘、试管型仪表盘。如下图所示:

2.3 绑定数据

3 个图表的数据绑定是一致的,如下图所示:

2.4 自定义标签

3 个图表自定义标签的方法一致,点击「样式>标签」,在「值标签」处选中「自定义」,输入 JavaScript 代码,并选中「使用 html 解析文本内容」。JavaScript 代码如下:

  1. function() { return this.category + "<br>实际值:" + this.value + "<br>目标值:" + this.target;}
复制代码

注:this.value 代表实际值,this.target 代表目标值,但 this.target 非官方接口,慎用。

在 10.0.16 版本及之后的设计器中,目标值官方接口为 this.targetValue。

如下图所示:

2.5 效果预览2.5.1 PC 端

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

2.5.2 移动端

App 端和 HTML5 端均支持,效果如下图所示:



您需要登录后才可以回帖 登录 | 立即注册  

本版积分规则

联系社区管理员|联系帆软|《帆软社区协议》|手机版|帆软社区|Copyright © 帆软软件有限公司 ( 苏ICP备18065767号-7 )

GMT+8, 2021-7-28 11:34 , Processed in 0.135302 second(s), 45 queries , Gzip On.

返回顶部 返回列表