HTML CSS JAVASCRIPT PYTHON PYTHON2 JAVA C C++ C# SQL Excel Linux AI BOOTSTRAP PHP 教程库 参考手册 技术文章 测验 练习 HOWTO FAQ
❮ 上一节 下一节 ❯

DC.js - 安装

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

  • DC.js 库
  • 编辑器
  • Web 浏览器
  • 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
  • SublimeText

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

Web 浏览器

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

Web 服务器

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

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

查看页面

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

❮ 上一节 下一节 ❯