Chart.js - 安裝

先決條件

在安裝並開始使用 Chart.js 庫之前，您需要對以下程式有基本的瞭解：

在開始使用 Chart.js 之前，我們需要先安裝它。以下幾種方法可用於安裝 Chart.js：

您可以使用 NPM 來安裝 Chart.js。複製並貼上以下命令以在您的專案中下載 Chart.js：

npm install chart.js --save

使用 CDN 在您的專案中安裝和使用 Chart.js 是最快捷簡便的方法之一。首先從 CDN 網站獲取最新的 CDN 連結：https://cdnjs.com。現在，複製 URL 中以 Chart.min.js 結尾的部分。

您可以使用 GitHub 下載最新版本的 chart.js 庫。連結 https://github.com 可以幫助您獲取 Chart.js 庫。

您也可以使用 jsDelivr 下載最新版本的 chart.js 庫。連結 https://www.jsdelivr.com/ 可以幫助您獲取 Chart.js 構建檔案。

使用 CDN - 要使用 chart.js 設定您的專案，請在您的 HTML 中包含一個 script 標籤，該標籤連結到 chart.js CDN。換句話說，如下所示將 CDN 載入到 body 部分：

<html>
<body>
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.1.1/chart.min.js"></script>
</body>
</html>

使用 jsDelivr - 您可以按照以下步驟使用 jsDelivr 為您的專案設定 chart.js：

步驟 1 - 建立一個檔案，並使用 "js" 關鍵字儲存檔名。例如：firstchart.js。
步驟 2 - 現在從 jsDelivr 下載 chart.js 庫。下載的庫將儲存在 filename.js 檔案中。複製並貼上連結 https://cdn.jsdelivr.net 到 .js 檔案中。
步驟 3 - 接下來，建立一個 HTML 檔案並編寫程式碼。將 script 標籤放在<body> </body> 部分。
步驟 4 - 最後，將此檔案新增到 script 標籤中，並使用路徑<script src = "path/folder/firstchart.js"></script>

列印頁面