Why you don’t get programming

The best description I’ve seen of programming is in Peter Welch’s1 memoir And Then I Thought I Was a Fish:

Programming requires the acceptance that you are entering meaningless symbols into a machine that’s going to spit out other meaningless symbols, and this can be hard to accept. It requires abandoning all hope of an answer for the existential “why?” in favor of shuffling boolean values ad infinitum. By no interpretation of the concept of understanding does a computer understand what you’re telling it or what it’s telling you.

Of course the symbols make perfect sense to the humans trained to use them. Otherwise you could not call them “symbols.”

But those symbols have no meaning to the computer. It is only dealing with the symbols in a predetermined manner specified by programmers and computer engineers.

Continue reading

Image Credits: Wikimedia / Glenlarson

The D3js Label Trilogy

Most of my use of D3 has been in scientific visualization, and scientists do love their labels. Since that’s become a particular specialty of mine, that’s what I wrote about when Safari Books Online invited me to be guest blogger. Here are links to my three posts on labels:

Creating a Right-Click Contextual Popup with D3

I’m not a big fan of taking things over from the browser, but just in case you have to, here’s how to override the standard context-menu behavior to provide more data about your visualization. Included: how to make sure the browser’s context menu still shows everyplace else.

Solving D3 Label Placement with Constraint Relaxing

When data points get close together, labels start to collide. Here we discuss using basic mathematical collision detection to adjust the placement of labels predictably and efficiently. Well, more efficiently than trying to introduce a physics simulation.

How to Create HTML Labels in SVG Using D3

Sometimes your labels need to be dressed up a bit. Text in SVG can do it, but SVG relies on you doing most of the placement. Instead, leverage the power of your browser’s layout engine in your labels by inserting HTML into your SVG. (Sadly, this technique does not work in IE yet.)

So there you are. Get labeling!

Image Credits: Flickr / adad

Commentary on a closet door

I’m back home after a week in San Francisco topped by a red-eye flight out of the place. But I wanted to get this down before I forgot about it.

The closet door at the San Francisco Marriott Marquis played a little trick on me every day I was there. See those door knobs? They don’t turn. You just pull on them to open the door. But they look like they turn.

So every time I opened the closet, my brain did this weird routine:

I need to get in the closet. Hey, why is my closet door locked? Oh, that’s right, you can’t turn these knobs.

There’s a moral in there about defying user expectations, but I am too tired to figure it out right know.

Image Credits: Thudfactor

Changing font names to comply with the OFL (Open Font License)

Screw the preamble. If you’re wondering why you would do such a thing, see below. The short answer is that some font foundries are generous but picky.

Anyway, changing the font names means futzing with the font metadata. So you have to open the font file, mess around inside, and then save it out as a new font.

Continue reading

Image Credits: Type by Tony Unruh

Technology is not a solution

I’ve been working on a talk called “Yes, Your CMS is Trying to Kill You.” My argument is that content management systems are technological tools, not miracle-machines. Just like any other tool, a content management system can cause misery when it is misused. So this promoted tweet from Microsoft was serendipitous:

Continue reading

Managing text contrast with an AngularJS Directive

Sometimes you need to set background colors dynamically. And if you are setting text over the top you have a real problem, because you need to set text color dynamically as well. Black text just isn’t readable on deep purple.

One way to go about this is to calculate the brightness from the RGB color. According to Themergency , the formula for this looks something like:

 Math.sqrt((0.299 * R * R) + (0.587 * G * G) + (0.114 * B * B))

A value of 128 is about a 50% brightness, give or take.

For more details on implementation, including jQuery and PHP solutions, the Themergency link is pretty useful. But if you’re inclined in an AngularJS direction, I wrote a little proof-of-concept directive below that should get you started.

Providing default functions to AngularJS Directives

Once of the nice things about AngularJS directives is that you can pass functions into the directives using ‘&’ scoping, but providing a default function is a little more tricky.

See the example below:

Whether or not you provide a function with ‘&’, Angular provides the mechanism for executing that function. For example, you can’t treat buttonAction above like the legend attribute. That is, you can’t say:

 ng-click=“buttonAction() || defaultAction()”

There’s always a buttonAction, even if it’s effectively a noop. To get around this, what you do is inspect the attrs object. This object contains the attribute values as the strings they originally are, before Angular interprets them. If buttonAction is defined here, then a function was passed; if not, then no function was provided and a default can be supplied in its place.