D3ライブラリをElectron（Atomシェル）で使用できますか？

エレクトロンのウェブサイトによると、電子で作られたアプリケーションはノードモジュールにアクセスできるという。彼らはD3ライブラリにアクセスできますか？もしそうなら、どのように設定することができますか？D3ライブラリをElectron（Atomシェル）で使用できますか？

出典

2015-09-25 AHonarmand

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

唯一重要なことは、電子がNODE_PATH変数を自動的に設定せず、requireモジュールのシステム/グローバルモジュールパスを調べないことです。だから、あなたはちょうどあなたがあなたのNODE_PATHにd3.jsへのパスを持っていることを確認する必要があります：

NODE_PATH="/PATH/TO/d3.js" electron /PATH/TO/APP

出典

2015-09-25 09:58:25

D3は、あなたの可視化アプリケーションをレンダリングするために使用するJavaScriptコードにインポートすることができNode.js moduleとして利用可能です。

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

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

出典

2015-10-03 15:31:43

d3を使用してSVGを追加する際に問題が発生しましたか？それはなぜd3で作成するのではなく、マークアップに入れるのでしょうか？ – felix

どちらのアプローチもうまく動作します。しかし、SVG要素をコードに挿入してSVG要素を埋め込んでD3グラフをレンダリングするのは良い設計慣行だと思います。これには2つの利点があります。（1）HTMLドキュメント内のどこにチャートが配置されているかを知らなくても、レンダリングコードはチャートのレンダリングに焦点を当てています。（2）チャートのレンダリングコードは、同じHTML文書でより簡単に再利用できます。たとえば、D3 Space Filler Explorerにはディスクごとに1つの円グラフがあります。複数のディスク円グラフをレンダリングするために、ディスクごとに1つのSVG要素が作成され、円グラフのレンダリングコードに渡されます。 –

最初はd3を使ってsvg要素を作成していましたが、何らかの理由で絶対に何も作成しませんでした。それをHTMLに入れてそれを選択することは、それが私のために働く唯一の方法です。実際にコンポーネントを内部で表示するにはhtml要素IDを与えられ、マークアップはコンポーネントの内部要件に準拠している必要はないため、svgを自分で作成することをお勧めします。 – felix

私たちは、NPMとD3をインストールする私たちのworkteamでこれを解決：

npm install d3 --save

とindex.htmlの中で私たちは、この置く：私たちは、ネバダ州からこの問題を取得した

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

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

出典

2016-10-27 01:33:18

D3ライブラリをElectron（Atomシェル）で使用できますか？

答えて

関連する問題