DC.js-インストール

この章では、DC.js開発環境をセットアップする方法を学習します。始める前に、次のコンポーネントが必要です-

  • DC.jsライブラリ
  • Editor
  • ウェブブラウザ
  • Webサーバー

手順を1つずつ詳しく見ていきましょう。

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コードであるため、すべてのDCコードを「script」タグ内に記述する必要があります。既存のDOM要素を操作する必要がある場合があるため、「body」タグの終わりの直前にDCコードを記述することをお勧めします。

DC.jsエディター

コードの記述を開始するには、エディターが必要です。次のようなJavaScriptをサポートする優れたIDE(統合開発環境)がいくつかあります。

  • VisualStudioコード
  • WebStorm
  • Eclipse
  • SublimeText

これらのIDEは、イン​​テリジェントなコード補完を提供するだけでなく、最新のJavaScriptフレームワークの一部をサポートします。凝ったIDEがない場合は、メモ帳やVIなどの基本的なエディターをいつでも使用できます。

ウェブブラウザ

DC.jsは、IE8以下を除くすべてのブラウザーで動作します。

Webサーバー

ほとんどのブラウザは、ローカルファイルシステムから直接ローカルHTMLファイルを提供します。ただし、外部データファイルのロードに関しては、特定の制限があります。このチュートリアルの後続の章では、CSVやJSONなどの外部ファイルからデータをロードします。したがって、最初からWebサーバーをセットアップすると、より簡単になります。

使い慣れた任意のWebサーバーを使用できます。例– IIS、Apacheなど。

ページの表示

ほとんどの場合、HTMLファイルをWebブラウザで開くだけで表示できます。ただし、外部データソースをロードする場合は、ローカルWebサーバーを実行し、サーバーからページを表示する方が信頼性が高くなります(http://localhost:8080)。