導讀：我們在工作中做一些原型圖時，尤其是后臺原型我們會經常涉及到統(tǒng)計圖信息，上兩期我詳細為大家介紹了如何繪制動態(tài)柱狀統(tǒng)計圖及動態(tài)折線統(tǒng)計圖，本期我將再次為大家詳細介紹一下如何繪制動態(tài)扇形統(tǒng)計圖。

首先我們先思考一下：

• 什么場景會使用到扇形統(tǒng)計圖呢？
• 相比于柱狀統(tǒng)計圖和折線統(tǒng)計圖我們繪制扇形統(tǒng)計圖的優(yōu)點在哪呢？
• 如何快速設計一款美觀的扇形統(tǒng)計圖以應用我們的工作中呢？

一、使用場景

扇形統(tǒng)計圖一般適用于一個維度各項指標占總體的占比情況，分布情況，能直觀顯示各項目和總體的占比、分布，強調整體和個體間的比較。適合比較簡單的占比比例圖，不要求精度的場景。例如一個班級男女生的占比情況。使用時數據建議不超過9條。

二、優(yōu)點分析

1、可以清楚地表示出各部分數量與總數之間的關系；

2、可以直觀地看出各部分數量的大小關系。

3、用扇形的面積表示部分在總體中所占的百分比；

三、設計原型

本期我將以常見的某學校各個學院學生在全校占比作為案例進行繪制原型。

演示預覽：https://7dnfs9.axshare.com

首先，我們先插入一個扇形圖，大小和圓角根據需要自行設置參數

我們將插入的扇形圖轉換為動態(tài)面板，雙擊動態(tài)面板后對里面的扇形圖再次轉換成動態(tài)面板并命名為【紅色】

復制【紅色】扇形圖成多個動態(tài)面板，并分別根據自身需要命名，此處我將根據顏色進行命名。

創(chuàng)建完成后，將這些統(tǒng)計圖疊加在一起

接下來，我們進行對已創(chuàng)建的扇形圖進行交互處理

點擊最外層的動態(tài)面板，設置 載入時-旋轉-選擇青色-順勢針-0°-線性-500ms，依次對疊加的扇形統(tǒng)計圖做相應的旋轉角度處理，接著我們預覽就可以得到一個動態(tài)的扇形統(tǒng)計圖啦~~

最后，我們可以為了讓扇形統(tǒng)計圖更加美觀，可以在統(tǒng)計圖中間加一個圓形，也可以在不同的統(tǒng)計圖上標上對應的數據相關信息，在此我就不做展示啦~~

希望本篇介紹可以幫助到小伙伴們~~~

本文由 @畫圖仔 原創(chuàng)發(fā)布于人人都是產品經理，未經作者許可，禁止轉載。

題圖來自Pexels，基于CC0協(xié)議。