Useful D3 tidbits

I’m slowly but surely beginning to make things happen with D3. Here are a few little notes that go by quickly but are worth remembering. 

Interpolating Numeric string values and 1e-6

Caution: avoid interpolating to or from the number zero when the interpolator is used to generate a string. When very small values are stringified, they may be converted to scientific notation, which is an invalid attribute or style property value in older browsers. For example, the number 0.0000001 is converted to the string "1e-7". This is particularly noticeable with interpolating opacity. To avoid scientific notation, start or end the transition at 1e-6: the smallest value that is not stringified in scientific notation.

D3′s margin convention 

More to come…

Working on integrating React and D3

Half-working so far, collecting reference:

On D3, React, and a little bit of Flux by Shirley Wu

Integrating D3.js visualizations in a React app by Nicolas Hery

Programmatic output from NPM

There’s --json flag. Hours of googling and trying dozens of packages later, there’s a --json flag. Six characters. ::sigh::

This will dump a machine-readable JSON object containing the complete dependency tree for any given package.json file:

npm install --dry-run --json

No we haven’t forgotten how to program

I skimmed this HN discussion attached to David Haney’s NPM & left-pad: Have We Forgotten How To Program? post, but it appeared to quickly devolve. The original article is well written but misses one of the key ideas of NPM.

Tiny NPM modules are not useless.

Anyone who’s ever written more than three programs has almost certainly refactored something out into a shared library. Even if it’s just copy and paste, code was reused. DRY (Don’t Repeat Yourself) is not just a mantra, it’s common sense. 

The huge innovation NPM enables, and the fuel of JavaScript’s insane innovation engine, is that people started publishing all those tiny libraries and functions as shareable modules. Suddenly one person’s back-pocket toolkit is used and vetted by tens of thousands of eyes. Ideal solutions quickly bubble up. Bugs are isolated and edge cases are corrected. 

NPM is a social network.

Those five “eyes closed” minutes Haney says could have been spent writing our own functions instead gets focused on more interesting parts of the project. 

While admittedly immature at times, the JavaScript ecosystem is insanely altruistic and open. Batteries may not be included, but if you’re in need, hundreds of people are more than happy to give you theirs. 

This whole, latest, node/NPM drama scares me, but the saying “never bet against JavaScript” is true. As soon as it broke, people started fixing it. The term “patch” is completely appropriate here. After a day or two, I expect everything will be working smoothly again. 

var sadness = “sadness”

I hate code like this, it smells like a failure of imagination or implementation or both:

export const INCREMENT_COUNTER = 'INCREMENT_COUNTER';
export const DECREMENT_COUNTER = 'DECREMENT_COUNTER';

Found in the otherwise wonderfully helpful and well considered simple-redux-boilerplate. I’m sure there’s a decent reason in there somewhere.