占比柱形圖

1.1 應用場景

當柱形圖 2 個系列之間是包含關係時，希望 2 個系列的柱形可以重疊在一起，這樣可以直覺看出 2 個系列間的佔比關係。

例如柱形圖存在 2 個系列：應付金額和運貨費，應付金額中包含運貨費，現在想要讓這 2 個系列柱形重疊，進而直覺展示運貨費佔應付金額的比例，如下圖所示：

1.2 功能入口

將柱形圖樣式>系列下的系列間隔設定為-100，即可將所有系列重疊在一起，如下圖所示：

2.1 準備資料

建立內建資料集 Embedded1，欄位和資料如下圖所示：

2.2 插入圖表

合併一篇區域儲存格，插入柱形圖，如下圖所示：

2.3 綁定資料

綁定柱形圖資料，如下圖所示：

2.4 新增標題

柱形圖新增標題：佔比柱形圖，位置靠左，設定好字體樣式，如下圖所示：

2.5 實現柱形重疊

柱形圖 樣式>系列 下，將系列間隔設定為 -100，如下圖所示：

2.6 自訂標籤

柱形圖 特效>條件顯示 下新增一個「標籤」型別的條件屬性，自訂正文內容和字元樣式，如下圖所示：

JavaScript 代碼如下：

function(){ 
 var result=(this.points[1].value/this.points[0].value*100).toFixed(2);
 result=result+"%";
 return result}

2.7 效果預覽

2.7.1 PC 端

儲存報表，點選「分頁預覽」，效果如下圖所示：

2.7.2 行動端

同時支援 App 端和 H5 端預覽，效果如下圖所示：

點選下載範本：占比柱形圖.cpt