d3-plugin-boilerplate

A ready-to-dine boilerplate for d3-plugins

This ready-to-dine boilerplate for d3-plug-ins is designed, so you'll be able to immediately start working on your plug-in's core implementation. You only require a fork! The boilerplate targets D3v4 and applies the best practices from:

• Mike Bostock – Towards Reusable Charts
• Mike Bostock's d3-shape source code
• Rob Moore – Towards updatable D3.js Charts

Getting started

• Fork this repository and clone your fork
• Change to the repository folder
• Run npm install
• Start the example by running a standalone server like python -m SimpleHTTPServer or http-server (node install -g http-server)
• Open browser at http://localhost:8000/example/index.html

Content

The plug-in implemented in this boilerplate doesn't do much obviously. It basically creates a rectangle per dataset in example/data.csv and the given width and height.

• package.json – Plug-in definition for node package manager (npm)
• index.js – Your plug-in's export manifest
• src/index.js – Your plug-in implementation requiring d3v4
• test/main-test.js – A test suite for your plug-in
• example/index.html – Simple HTML page demonstrating your plug-in
• example/data.csv – Some sample data
• img/ – A resource folder ignored during all npm/build processes

See individual files for more documentation. After you've built the plug-in with npm install or npm run prepublish you'll find the shippable artifacts inside the build/ folder.

Scripts

Using npm run the following scripts are available:

• pretest – Pre-testing script that bundles your plug-in into a single file to build/ so you'll be able to test using example/
• test – Runs your test suite against the plug-in implementation
• prepublish – Bundles your plug-in into a single file and its minified version to build/

Additionally the following scripts are available:

• run-example-linux.sh – Starts a simple HTTP server so you'll be able to check out the example implementation on http://localhost:8000/example/index.html

To-Do's

• Select a license
• Generalize package.json
• Include some library for demonstration
• Document content of repository
• Document the pretest, prepublish, test scripts
• Reestablish a post-publish npm script

License

Code is licensed under Apache License Version 2.0.

Icon made by Freepik from Flaticon is licensed by CC 3.0 BY a