反饋已提交

網絡繁忙

當前為10.0版本文檔,更多實例內容將在最新幫助文檔中展現,點選跳轉至 最新版幫助文檔

JS实现改变图表指定分类名颜色

1. 概述

1.1 问题描述

在进行图表展示时,有时为了突出某些分类对值的影响,需要对分类名做特殊显示。

例如在一个月的销量中,将周末两天的分类名标红,效果如下图所示:

image.png

1.2 实现思路

利用 JS 自定义分类轴标签格式。

2. 示例

2.1 报表设计

1)新建普通报表,新建内置数据集 Embedded1,如下图所示:

image.png

2)单元格里插入折线图,如下图绑定图表数据:

image.png

3)选中折线图,在样式>坐标轴>X轴中自定义轴标签格式,并使用html解析文本内容,如下图所示:

image.png

JS 代码如下:

function(){ 
    var date = new Date(this);
    if(date.getDay()==0||date.getDay()==6){
        return "<font color='red'>"+date.getDate()+"</font>"
    }else{
        return date.getDate();
    }
}

2.2 效果预览

1)PC 端

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

image.png

2)移动端

1584774862750184.png

3. 模板下载

已完成的模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\图表JS实例\JS实现改变指定分类名颜色.cpt

点击下载模板:JS实现改变指定分类名颜色.cpt

附件列表


主題: 原简体文档
已經是第一篇
已經是最後一篇
  • 有幫助
  • 沒幫助
  • 只是瀏覽
  • 圖片不清晰
  • 用語看不懂
  • 功能說明看不懂
  • 操作說明太簡單
  • 內容有錯誤

文 檔回 饋

滑鼠選中內容,快速回饋問題

滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

不再提示

10s後關閉