DC.js - 安装


在本章中,我们将学习如何设置 DC.js 开发环境。在开始之前,我们需要以下组件 -

  • DC.js 库
  • 编辑
  • 网页浏览器
  • 网络服务器

让我们一一详细地了解这些步骤。

DC.js安装

直流安装非常容易设置。请按照以下步骤在您的计算机上安装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代码,因此我们必须将所有DC代码写在“script”标签内。我们可能需要操作现有的 DOM 元素,因此建议在“body”标签末尾之前编写 DC 代码。

DC.js 编辑器

我们需要一个编辑器来开始编写代码。有一些很棒的 IDE(集成开发环境)支持 JavaScript,例如 -

  • 视觉工作室代码
  • 网络风暴
  • 崇高文本

这些 IDE 提供智能代码完成功能并支持一些现代 JavaScript 框架。如果我们没有任何花哨的 IDE,我们总是可以使用基本的编辑器,例如记事本、VI 等。

网页浏览器

DC.js 适用于除 IE8 及更低版本之外的所有浏览器。

网络服务器

大多数浏览器直接从本地文件系统提供本地 HTML 文件。但是,加载外部数据文件时存在某些限制。在本教程的后续章节中,我们将从外部文件(例如 CSV 和 JSON)加载数据。因此,如果我们从一开始就设置 Web 服务器,对我们来说会更容易。

我们可以使用任何我们熟悉的网络服务器。例如 – IIS、Apache 等。

查看页面

大多数情况下,我们只需在网络浏览器中打开 HTML 文件即可查看。但是,在加载外部数据源时,运行本地 Web 服务器并从服务器查看页面 ( http://localhost:8080 )更为可靠。