WebGL本身支援LINES，POINTS和TRIANGLES三類光柵化圖元（當然還有相應的STRIP等形式），只需要在繪製的時候準備直線的頂點資料，在呼叫drawElements的時候傳入gl.LINES讓流水線按照線段的模式去裝配圖元即可（參見這個API）。其他部分（VS，PS）和繪製三角形一樣。
這個方法的缺點是有些瀏覽器的WebGL版本不支援線寬的設定（對於POINTS型別的圖元一般是可以設定點的大小的），只支援線寬為1的，沒有反走樣的線段。
如果想要支援反走樣，並且能夠讓使用者自定義線段的樣式（比如虛線效果）、寬窄，另外一個比較麻煩的實現方法是，用兩個三角形拼成的四邊形來表示一條線段：
這個方法需要注意的是拐點連線處如何拼接，這裡有兩篇文章可以去參考。當然也可以再額外新增三角形用於生成線段兩端的拐點的圓弧。同時也可以在Pixel Shader里加入虛線等效果。基於這個思路，實際上你不但可以繪製反走樣的直線，還能夠繪製貝塞爾曲線等複雜的效果，參見GPU Gems裡的這篇文章。理論上，你甚至可以基於這個思路實現一個完整的基於WebGL的SVG渲染器。
如果畫線的目的不是為了繪製網格，而是用於繪製線框模型的話，一個比較優雅的實現思路是基於重心座標插值：
具體原理也不再贅述，可以去看這兩篇文章。這個方法的優點是，可以繪製反走樣的線框模型，同時支援線框內部著色，支援具有透視效果的線段（也可以沒有透視效果）。缺點是這個方法需要頂點提供額外的用於重心座標插值的幾何資料，並且如果頂點被多個三角形共享，必須分裂成多個頂點，否則會導致重心座標插值出錯（如果有Geometry Shader的API則可以透過Geometry Shader來分裂頂點生成幾何資料，WebGL裡只能透過CPU提前處理這部分資料）。另外的一個缺點是如果某個邊被兩個三角形共享，則會生成雙倍寬度的線段。
WebGL本身支援LINES，POINTS和TRIANGLES三類光柵化圖元（當然還有相應的STRIP等形式），只需要在繪製的時候準備直線的頂點資料，在呼叫drawElements的時候傳入gl.LINES讓流水線按照線段的模式去裝配圖元即可（參見這個API）。其他部分（VS，PS）和繪製三角形一樣。
這個方法的缺點是有些瀏覽器的WebGL版本不支援線寬的設定（對於POINTS型別的圖元一般是可以設定點的大小的），只支援線寬為1的，沒有反走樣的線段。
如果想要支援反走樣，並且能夠讓使用者自定義線段的樣式（比如虛線效果）、寬窄，另外一個比較麻煩的實現方法是，用兩個三角形拼成的四邊形來表示一條線段：
這個方法需要注意的是拐點連線處如何拼接，這裡有兩篇文章可以去參考。當然也可以再額外新增三角形用於生成線段兩端的拐點的圓弧。同時也可以在Pixel Shader里加入虛線等效果。基於這個思路，實際上你不但可以繪製反走樣的直線，還能夠繪製貝塞爾曲線等複雜的效果，參見GPU Gems裡的這篇文章。理論上，你甚至可以基於這個思路實現一個完整的基於WebGL的SVG渲染器。
如果畫線的目的不是為了繪製網格，而是用於繪製線框模型的話，一個比較優雅的實現思路是基於重心座標插值：
具體原理也不再贅述，可以去看這兩篇文章。這個方法的優點是，可以繪製反走樣的線框模型，同時支援線框內部著色，支援具有透視效果的線段（也可以沒有透視效果）。缺點是這個方法需要頂點提供額外的用於重心座標插值的幾何資料，並且如果頂點被多個三角形共享，必須分裂成多個頂點，否則會導致重心座標插值出錯（如果有Geometry Shader的API則可以透過Geometry Shader來分裂頂點生成幾何資料，WebGL裡只能透過CPU提前處理這部分資料）。另外的一個缺點是如果某個邊被兩個三角形共享，則會生成雙倍寬度的線段。