項目中要使用有漸變顏色的折線圖，所以最近研究了一下，寫一個簡單的教程，主要是為了能讓人明白最主要的功能，主要講的是實現的思路，所以盡量簡化了。

首先，我是用UIBezierPath + CAShapeLayer畫線，用CAGradientLayer寫漸變圖層。

這里只講一下CAGradientLayer：

初始化方式，以及設置frame跟CAShapelayer沒什么區別，具體說一下其他的屬性。

colors:圖層內漸變的顏色的數組，是CGColor的類別

startPoint和endPoint：可以設置漸變的方向是豎直的從上到下，或是從下到上，或是斜著漸變等。

locations:是CAGradientLayer中顏色漸變區間的數組，如果不設置這個屬性，系統會自動幫你設置漸變區間。

例如：_gradientLayer.location = @[@(0.1),@(0.2)],這樣的形式。

另外，用UIBezierPath的原因是在于UIBezierPath其實是對Core Graphics框架關于path的進一步封裝，所以使用起來比較簡單。

其次是對折線圖進行細分，我把折線圖分為坐標軸X軸和Y軸部分、折線圖繪制部分、漸變圖層繪制部分，這三部分來完成。

1、X軸和Y軸

首先是找原點，我先將原點距view的左和下的距離設置出來，就很容易能得到原點的坐標，然后通過原點的坐標繪制X軸跟Y軸.

接下來上代碼：

在創建X軸跟Y軸的時候，利用Core Graphics繪制文字比較方便，所以把文字跟線條分開繪制。

坐標軸不細說，demo中會有詳細的注釋。

主要講一下折線以及漸變圖層的繪制。

繪制折線只要將每個數據的坐標點算出來，就很容易了繪制了。

首先，計算X軸以及Y軸的刻度單位。

其次計算數組中每個點的坐標。

其中，path是折線的路徑，newPath是漸變圖層的路徑，lastPointX和lastPointY是為了看最后一個點的位置，得出漸變圖層的范圍。

然后添加到最后一個點的線。

接著有了折線的路徑，以及漸變圖層的路徑，就可以將這兩個路徑賦值給layer。

賦值過后，然后將漸變圖層的遮罩層設置為CAShapelayer就完成了。

demo:漸變顏色的折線圖