DC.js - 安裝

本章我們將學習如何設定 DC.js 開發環境。在開始之前，我們需要以下元件：

DC.js 庫
編輯器
網路瀏覽器
Web 伺服器

讓我們一步一步詳細地學習。

DC.js 安裝

DC 的安裝非常容易設定。按照以下步驟在您的機器上安裝 *DC*。

下載 DC 庫

DC 是一個開源庫；使用連結 https://github.com/dc-js/dc.js/releases 下載檔案。

下載最新版本的 DC 檔案。（截至目前，最新版本是 2.0.2。）下載完成後，解壓 DC 資料夾並將其貼上到專案的根資料夾或任何其他您想儲存所有庫檔案的資料夾中。

示例 HTML 頁面如下所示。

<!DOCTYPE html>
<html lang = "en">
   <head>
      <script src = "js/d3.js"></script>
      <script src = "js/crossfilter.js"></script>
      <script src = "js/dc.js"></script>
   </head>
   
   <body>
      <script>
         // write your dc code here.. 
      </script>
   </body>
</html>

DC 是 JavaScript 程式碼，因此我們必須在“script”標籤內編寫所有 DC 程式碼。我們可能需要操作現有的 DOM 元素，因此建議在“body”標籤結束之前編寫 DC 程式碼。

DC.js 編輯器

我們將需要一個編輯器來開始編寫程式碼。有一些優秀的 IDE（整合開發環境）支援 JavaScript，例如：

Visual Studio Code
WebStorm
Eclipse
Sublime Text

這些 IDE 提供智慧程式碼補全，並支援一些現代 JavaScript 框架。如果我們沒有任何高階 IDE，我們始終可以使用基本的編輯器，例如記事本、VI 等。

網路瀏覽器

DC.js 適用於除 IE8 及更低版本以外的所有瀏覽器。

Web 伺服器

大多數瀏覽器直接從本地檔案系統提供本地 HTML 檔案。但是，在載入外部資料檔案時，存在某些限制。在本教程的後續章節中，我們將從外部檔案（例如 CSV 和 JSON）載入資料。因此，如果我們從一開始就設定 Web 伺服器，將會更容易。

我們可以使用任何我們熟悉的 Web 伺服器。例如 – IIS、Apache 等。

檢視頁面

在大多數情況下，我們只需在 Web 瀏覽器中開啟 HTML 檔案即可檢視它。但是，在載入外部資料來源時，執行本地 Web 伺服器並從伺服器（**https://:8080**）檢視頁面更可靠。

列印頁面