block by hugolpz 1c34e14d8b7dd457f802

Printing map.svg file via D3js, Nodejs, Jsdom

Full Screen

D3 map client & server side

Minimal demo on how to create maps both :

  1. client side via d3js, topojson, & queue.js
  2. server side via exact same ressources + nodejs.

JS

Data

The topojson data is loaded via http request and so should be stored online. Client side accept relative url, serverside requires absolute url (http://x.yz/a/file.json).

Client side

Open ./index.html in web browser. Viz based on ./script.js D3js codes.

Server side via Nodejs

Based on the exact same ./script.js. Thanks to npm jsdom, we create on serverside a virtual browser, the svg dataviz, to grab this svg element and print it out.

Dependencies:

 npm install   # install jsdom locally

In terminal, pass variables and run the nodejs code:

WIDTH=800 \
    URL=http://bl.ocks.org/hugolpz/raw/1c34e14d8b7dd457f802/administrative.topo.json \
    node mapIt.node.js

It creates the standalone map.svg file similar to the client side map.

script.js

index.html

mapIt.node.js

package.json

queue.v1.min.js

topojson.v1.min.js