Can D3 library be used with the Electron (Atom shell)?

Question

Electron's website says that the applications made with electron can have access to node modules. Can they have access to the D3 library? If so, how can it be set up?

Answer 1

D3 is available as a Node.js module that can be imported into the JavaScript code you want to use to render your visualisation application.

As an example of how to integrate D3 into an Electron application, have a look at my D3 Space Filler Explorer application on GitHub. This application visualises disk space use with multiple D3 pie charts and a D3 treemap.

One pattern I found useful was to inject the SVG element into the D3 visualisation, which differs from the usual approach in D3 examples which creates the SVG element in the visualisation. See examples of this dependency injection in the /app/js/pie-chart.js and /app/js/treemap-chart.js files.

Answer 2

All (at least theoretically) pure JS modules are compatible with electron, since it also provides a (CommonJS) javascript runtime environment (io.js).

The only important thing is that electron doesn't automatically sets the NODE_PATH variable and doesn't look in system/global modules path for required modules. So you just have to make sure that you have the path to d3.js on your NODE_PATH:

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