Pablo Navarro pnavarrc

Sublime Text 2 - Useful Shortcuts

Tested in Mac OS X: super == command

Open/Goto

super+t: go to file
super+ctrl+p: go to project
super+r: go to methods

Automatic Label Placement

This example is an extension of Mike Bostock’s tutorial Lets Make a Map that implements automatic label placement using the force layout and multiple foci. The centroid of each feature will define a foci of the force. This foci will attract the label that correspond to that feature (and ignore the others). The labels will repel themselves to avoid overlapping.

References

Bee Anatomy

This gist is to show how to integrate a raster image and a svg overlay to create images that show the parts of an object. In this case, I show the main parts of the bee anatomy.

The svg image was created with Inkscape. First, the raster image is inserted in the svg file to draw the shapes. Then, each path is given an id to allow its identification in the web version. For instance, the forewings, the lines and the corresponding text are given ids to allow its identification and assignment of a class in the page.

WIth D3, we use mouseover and mouseout to show and hide the elements of the same class that the selected element.

Thanks to Joost Witteveen for sharing the photo of the bee with cc Attribution license.

Purpose

Angular directive code to help resize/redraw non-responsive elements (like D3 charts) in a bootstrap responsive design when the window moves across bootstrap boundaries.

(I edited my boostrap to create an extra size for some 7" tablets and landscape phones @ 600px)

What do you think? Good? Bad? Ugly? How could it be better? What other options exist?

Credit to tagtree for the Rickshaw directive help: http://tagtree.tv/d3-with-rickshaw-and-angular

How to get a remote repository (from BitBucket, GitHub or anyone)

$ git clone https://github.com/<username>/<repository>.git

If you have added a SSH key, then you can also use this command:

$ git clone [email protected]:<username>/<repository>.git

How to create a new repository from the command line

Introduction to GraphQL

Install and Configure GraphiQL

Or alternatively, use the GitHub GraphQL Explorer

Install GraphiQL
Create a Personal Access Token: Give it access to repo, gist, notification and user (or less, if you want).
Set the endpoint to https://api.github.com/graphql, the method to POST and add the following header:

	from fabric.api import *

	env.hosts = ['host.name.com']
	env.user = 'user'
	env.key_filename = '/path/to/keyfile.pem'

	def local_uname():
	local('uname -a')

	def remote_uname():

	// Which HTML element is the target of the event
	function mouseTarget(e) {
	var targ;
	if (!e) var e = window.event;
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) // defeat Safari bug
	targ = targ.parentNode;
	return targ;
	}

	angular.module('d3AngularApp', ['d3'])
	.directive('d3Bars', ['$window', '$timeout', 'd3Service',
	function($window, $timeout, d3Service) {
	return {
	restrict: 'A',
	scope: {
	data: '=',
	label: '@',
	onClick: '&'
	},