canvas JavaScript API 是用於在網路上建立和操作圖形的強大工具。它允許您使用 JavaScript 程式碼繪製 2D 圖形，並且大多數現代 Web 瀏覽器都支援它。遊戲操作、動畫、影片處理等等都來自 Canvas API。
canvas API以canvas元素的形式實現，canvas元素是一個可以放置在HTML文件中的HTML元素。 canvas 元素用作繪圖表面，可以使用 CSS 進行樣式設定和定位。
要在畫布上繪製圖形，可以使用canvas API的繪圖方法，例如arc、lineTo和fillRect。這些方法可讓您在畫布上繪製形狀、線條和其他圖形。
Google Chrome 和 Mozilla Firefox 是主要支援 canvas API 的瀏覽器。切勿將 Safari 或 Microsoft Edge 用於畫布 API。除 Internet Explorer 之外的其他主要瀏覽器都支援 canvas API。
Canvas 適用於 Windows、Linux、Mac、Android 和 iOS 以及所有主要瀏覽器。作業系統應該進行所有安全檢查和升級，以確保canvas API正常運作。這裡有此類瀏覽器及其版本的清單。
Chrome
#Firefox，但不支援擴充版本
邊緣
Respondus Lockdown 瀏覽器僅支援最新的系統需求。
Safari 僅適用於 Macintosh
至少具有 1GB RAM 的系統適合使用 canvas API。本機行動瀏覽器對平板電腦設備的支援較少。預設 Android 瀏覽器會隨行動裝置而變化。
Safari 是預設瀏覽器，對 Canvas 支援有限。
Photon Flash Player 支援 Flash
Chrome 是預設瀏覽器，對 Canvas 支援有限
#火狐瀏覽器
最新版本 Safari 中的 Macintosh VoiceOver
#最新版本的 Firefox 中的個人電腦 JAWS
#個人電腦 NNVDA（最新版本的 Firefox）
#Chrome 不支援畫布中的螢幕閱讀器。
Canvas 是一個 HTML 5 元素。 canvas 中的 getContext() 方法傳回繪圖上下文。如果傳回null，表示canvas元素不支援。
使用者可以依照下面的語法，用下面的程式碼檢查瀏覽器是否支援canvas元素。
if(document.createElement('canvas').getContext){ /*Canvas object available*/ }
語法中的 if 條件建立一個畫布元素並嘗試取得上下文。如果上下文返回，則瀏覽器支援畫布。
在此程式中，使用者可以透過點擊按鈕檢查瀏覽器對畫布的支援。當您按一下該按鈕時，該事件會呼叫函數，該函數會嘗試使用上述語法來取得畫布上下文。程式中存在一個標誌變量，用於區分瀏覽器支援並向使用者顯示訊息。
Check if your browser support canvas API in JavScript
以下是如何使用畫布 API 在畫布上繪製簡單圓圈的範例 -
Drawing a circle using Canvas JavaScript API
在此範例中，建立的 canvas 元素的 id 為“myCanvas”，寬度和高度分別為 200 和 100 像素。 getContext方法用於取得畫布的繪圖上下文，arc方法用於繪製一個中心點為(95, 50)、半徑為40像素的圓。然後使用描邊方法在畫布上繪製圓圈。
本教學幫助我們了解畫布 API 是否是所有主要瀏覽器的內建本機部分。並非所有主流瀏覽器都有內建的 canvas API。我們現在知道了一段程式碼來偵測瀏覽器對 canvas API 的支援。使用者可以在使用先前的瀏覽器對畫布進行編碼時避免錯誤，支援使用此程式碼片段進行檢查。
以上是Canvas Javascript API 在主要瀏覽器中的作用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
