1. 概述
1.1 問題描述
某些場景下,圖表 Y 軸是來源於數據集的日期型數據,Y 軸的軸标簽也需要修改爲日期格式。以折線圖爲例,效果如下圖所示:
如果只是将圖表樣式>坐标軸>Y軸>格式下的軸标簽修改爲日期型。
前端預覽時,是無法正常顯示圖表數據的,如下圖所示:
那麽如何設置既能将軸标簽改爲日期格式又能保證圖表正常展示數據呢?下面将詳細介紹。
1.2 解決方案
1)将數據集中 Y 軸對應的日期數據拖入到單元格中,用DATETONUMBER(date)公式轉爲毫秒。
2)圖表綁定已經轉化爲毫秒的單元格數據。
3)最後将圖表 Y 軸的軸标簽修改成日期型。
注:DATETONUMBER(date)公式的介紹參見文檔:日期和時間函數
2. 示例
2.1 準備數據
新建普通報表,新建内置數據集,将數據集名稱修改爲 ds1,如下圖所示:
數據集中工藝字段爲字符串型,對應 X 軸的分類。排期字段爲日期型,對應 Y 軸的值。
2.2 插入圖表
合并一片區域單元格,選中合并後的單元格 A1,點擊插入圖表快捷按鈕,插入折線圖,如下圖所示:
2.3 日期轉毫秒
将内置數據集中的工藝和排期字段分别拖到 A22 和 B22 單元格中,選中 D22 單元格,點擊插入公式快捷按鈕,插入公式:DATETONUMBER(B22),如下圖所示:
2.4 綁定數據
折線圖屬性面板選擇單元格元素>數據,數據來源下拉選擇單元格數據,分類名設置爲 A22 單元格,新增一個系列名爲空的系列,設置值爲 D22 單元格,如下圖所示:
2.5 設置樣式
2.5.1 标題
折線圖屬性面板選擇單元格元素>樣式>标題,勾選标題可見,标題内容爲:半導體工藝優化排期,如下圖所示:
2.5.2 坐标軸
折線圖屬性面板選擇單元格元素>樣式>坐标軸>Y軸,值定義最小值爲:1262275200000,表示軸标簽最小爲2011-03-13,将軸标簽修改爲日期型,如下圖所示:
注:設置最小值的目的是爲了讓 Y 軸的值可以有一個合理區間,讓折線圖走勢更加明顯。
2.5.3 提示
折線圖屬性面板選擇單元格元素>樣式>提示,勾選使用數據點提示,選中分類名、系列名、值,值的格式設置爲日期型,如下圖所示:
2.6 隐藏單元格
選中第 22 行,右鍵選擇隐藏,前端不展示單元格數據,如下圖所示:
2.7 效果預覽
2.7.1 PC 端
保存報表,點擊分頁預覽,效果如下圖所示:
2.7.2 移動端
3. 模板下載
已完成模板參見:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\Chart\圖表Y軸标簽設置爲日期格式.cpt
點擊下載模板:圖表Y軸标簽設置爲日期格式.cpt