web-dev-qa-db-ja.com

D3ライブラリはElectron(Atom Shell)で使用できますか?

ElectronのWebサイトによると、electronで作成されたアプリケーションはノードモジュールにアクセスできます。彼らはD3ライブラリにアクセスできますか?もしそうなら、それはどのように設定できますか?

13
AHonarmand

D3は Node.jsモジュール として利用可能であり、視覚化アプリケーションのレンダリングに使用するJavaScriptコードにインポートできます。

D3をElectronアプリケーションに統合する方法の例として、GitHubの私の D3 Space Filler Explorer アプリケーションを見てください。このアプリケーションは、複数のD3円グラフとD3ツリーマップを使用してディスク領域の使用を視覚化します。

私が有用だと思ったパターンの1つは、SVG要素をD3視覚化に挿入することでした。これは、視覚化でSVG要素を作成するD3の例の通常のアプローチとは異なります。 /app/js/pie-chart.jsファイルと/app/js/treemap-chart.jsファイルでこの依存性注入の例を参照してください。

10
Jeffrey Morgan

Npmでd3をインストールするワークチームでこれを解決しました:

_npm install d3 --save_

そしてindex.htmlにこれを置きます:

<script>var d3 = require("d3")</script>

この問題はnv.d3.jsの18行目から発生しており、ノードモジュールとしてd3を必要とする小さな関数があり、アプリではbower_componentsで使用していたため、npmを使用してインストールし、node_modulesから直接インデックスにリクエストします。私が言ったように、おそらく私たちと同じようにこの問題を解決するでしょう。

2
Pablodotjs

すべての(少なくとも理論的には)純粋なJSモジュールは、(CommonJS)javascriptランタイム環境(io.js)も提供するため、electronと互換性があります。

唯一重要なことは、electronがNODE_PATH変数を自動的に設定せず、requiredモジュールのシステム/グローバルモジュールパスを検索しないことです。したがって、d3.jsNODE_PATHへのパスがあることを確認する必要があります。

NODE_PATH="/PATH/TO/d3.js" electron /PATH/TO/APP
2
Yan Foto