My personal collection of d3.js code snippets for Sublime 2 (Time Saver!!!!)
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README.md Added link Jan 16, 2014
attr.sublime-snippet
circle.sublime-snippet
comment.sublime-snippet Added radial gradient Feb 11, 2013
console.sublime-snippet Changes to new d3.js coding style Feb 5, 2013
dfun.sublime-snippet Updates to new d3.js style Feb 5, 2013
each.sublime-snippet
filter.sublime-snippet Adds svg filter snippets Feb 12, 2013
gradient.sublime-snippet
group.sublime-snippet
join.sublime-snippet Adds the first bunch of d3.js snippets to the repo Aug 10, 2012
line.sublime-snippet Changes to new d3.js coding style Feb 5, 2013
margin.sublime-snippet Adds margin snippet Sep 12, 2013
path.sublime-snippet Updates to new d3.js style Feb 5, 2013
polygon.sublime-snippet
polyline.sublime-snippet Adds polyline snippet Sep 10, 2013
radial_gradient.sublime-snippet Changes radial gradient jump point Feb 11, 2013
randomcolor.sublime-snippet Adds the first bunch of d3.js snippets to the repo Aug 10, 2012
rect.sublime-snippet Changes to new d3.js coding style Feb 5, 2013
short_comment.sublime-snippet Adds the first bunch of d3.js snippets to the repo Aug 10, 2012
stroke.sublime-snippet Changes slowly to new d3.js attr style Feb 5, 2013
style.sublime-snippet Changes to new d3.js coding style Feb 5, 2013
text.sublime-snippet Fixes text snippet Feb 5, 2013
turbulence.sublime-snippet Adds svg filter snippets Feb 12, 2013
use.sublime-snippet Adds gradient snippet Feb 8, 2013
xscale.sublime-snippet Adds the first bunch of d3.js snippets to the repo Aug 10, 2012
yscale.sublime-snippet Adds the first bunch of d3.js snippets to the repo Aug 10, 2012

README.md

d3.js-Sublime-2-Snippets

My personal collection of d3.js code snippets for Sublime 2 (Time Saver!!!!). To support me buy my iPad app Vista Point for Travel Enthusiasts (0.99$)

HOW TO INSTALL

Browse to the following path on your UNIX system. Make sure you change the YOUR_USERNAME placeholder with your current user.

cd /Users/YOUR_USERNAME/Library/Application\ Support/Sublime\ Text\ 2/Packages/User/

If the folder 'JavaScript' doesn't exisits inside of this folder, create it:

mkdir JavaScript

Enter this folder:

cd JavaScript

I recommend to checkout the repository directly in this folder:

git clone git@github.com:roundrobin/d3.js-Sublime-2-Snippets.git .

Now you will see inside of the ./JavaScript folder, a bunch of .sublime-snippet files. Feel free to add new ones.

Restart Sublime 2.

HOW TO USE

After you've installed the snippets, you can trigger the insertion of a snippet by typing in one of the follwing commands inside of a .js file and pressing the TAB key afterwards.

The list of available snippets:

.a + TAB        ==> .attr("",)
  
.st + TAB       ==> .style("",)
  
circle + TAB    ==> append("circle")...
  
rect + TAB      ==> append("rect")...
  
text + TAB      ==> append('text')...
  
line + TAB      ==> append('line')...
  
polyline + TAB  ==> append('polyline')...
  
path + TAB      ==> append('path')....
  
polygon + TAB   ==> append('polygon')...
  
group + TAB     ==> append('group')...
                     
xscale + TAB    ==> var xscale = d3.scale.linear().domain(...
 
yscale + TAB    ==> var yscale = d3.scale.linear().domain(...
 
randcol + TAB   ==> '#'+Math.floor(Math.random()*16777215).toString(16);
 
join + TAB      ==> .selectAll("").data().enter().append("")...
 
con + TAB       ==> console.log('LOG:','')
 
dfun + TAB      ==> function(d,i){ return ''} 
 
margin + TAB    ==> var margin = {top: 0 ...
 
gradient + TAB  ==> var gradient = defs.append('linearGradient') ...
 
radial + TAB    ==> var gradient = defs.append('radialGradient') ...
 
con + TAB       ==> console.log("Log:", "");
 
filter + TAB    ==> defs.append('filter')