Sketch小技巧—進階其他幾種繪製餅圖的方法(二)

對數據進行可視化處理時,餅圖是常用的圖形之一,餅圖一般用於體現各個項之間的佔比情況,表現爲由一組或者多組數值按照百分比扇區組成的圓形圖,最終圓形圖的比例爲100%。今天帶領大家瞭解下其他畫餅圖的方法!

獲取最新版Sketch 55 for mac(矢量繪圖軟件)


1、布爾運算繪製餅圖

在設計工具中使用線條勾勒一些規則圖形是比較麻煩的,所以通過線條勾勒出扇區去組成餅圖的方法顯然太過於笨拙。因此,我們可以用布爾運算的法則來對既有圓形進行相交、相減處理,最終得到我們想要的扇區。

具體步驟如下:

首先,使用橢圓工具繪製一個正圓形(小tips:選中橢圓工具後,按住shift鍵即可繪製正圓形),爲了方便區分,我們設置正圓形爲藍色填充,並取消邊框。

然後,使用三角形工具,繪製一個三角形,我們也可以通過雙擊三角形進入編輯模式,把三角形左側的端點拉到中間垂直的位置,形成一個直角三角形。

再然後,把直角三角形和圓形放在一起,且直角和圓的中心點對齊,選中兩者,複製一份,分別進行相減、相交的布爾運算,即可得到3/4和1/4大小的扇區。


最後,把得到的扇區組合在一起,分別填充不同的顏色,即可得到一個餅圖,如果想要一個圓環圖,很簡單,在中間放一個白色填充的正圓形即可。布爾運算這一招的缺點是如果要用三角形劃分餅圖的扇區比例,則需要把勾股定理、正弦定理、餘弦定理了解一下。。。

2、環形漸變

在Sketch中,一共支持三種漸變效果,分別是線性漸變、徑向漸變和環形漸變,其中,環形漸變可以用來實現餅圖,具體步驟如下:

首先,依然使用橢圓工具繪製一個正圓形,取消邊框,點擊➕設置填充爲環形漸變,如下圖:

然後,在圓形上任意位置上增加漸變點,注意,每個位置需要同時存在2個漸變點(一內一外,等會用到),設置漸變點時,可以通過按數字鍵0-9,精確定位漸變點的位置,設置完成後,如下圖所示。

最後,選中每個漸變點,並設置漸變點的填充顏色,外漸變點和順時針相近的內漸變點,設置爲同一個填充顏色,代表它們的扇區顏色,可以使用快捷鍵Tab快速切換漸變點,Control+C組合鍵進行吸色,即可得到一個下圖所示的餅圖。這一招的優點是可以快速調整扇區的比例,只要拖動漸變點即可,缺點是扇區分割時會出現鋸齒,目前還沒有鋸齒的解決方案。

3、Sketchy Pies插件

Sketchy Pies插件,一鍵就能生成漂亮的餅圖,還支持通過顏色代碼和比例設置扇區,比任何方法都快。
想快速畫餅圖的朋友可以點擊下面鏈接下載插件。

點擊獲取原文Sketchy Pies for mac(sketch插件 圖層轉換餅狀圖)

以上就是小編爲大家帶來Sketch小技巧—其他幾種繪製餅圖的方法介紹。還有更多詳細、實用的功能,大家快來關注小編吧。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章