https://github.com/fabriciotav/d3-snippets-for-sublime-text-2

D3.js snippets for Sublime Text 2
https://github.com/fabriciotav/d3-snippets-for-sublime-text-2

Last synced: about 1 month ago
JSON representation

D3.js snippets for Sublime Text 2

• Host: GitHub
• URL: https://github.com/fabriciotav/d3-snippets-for-sublime-text-2
• Owner: fabriciotav
• Created: 2014-03-18T20:08:53.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2014-03-18T22:00:50.000Z (over 10 years ago)
• Last Synced: 2024-10-30T15:51:18.282Z (about 1 month ago)
• Size: 118 KB
• Stars: 12
• Watchers: 4
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-d3 - d3-snippets-for-sublime-text-2 - Snippets for Sublime (Code Editors)
• awesome-d3 - d3-snippets-for-sublime-text-2 - Snippets for Sublime (Code Editors)

README

        
D3.js snippets for Sublime Text 2

=================================

## Selections

**sel** ⇥ `d3.select('')`

**sela** ⇥ `d3.selectAll('')`

**attr** ⇥ `.attr('', )`

**translate** ⇥ `.attr('transform', 'translate(' + 0 + ',' + 0 + ')')`

**style** ⇥ `.style('fill', '#000')`

**join** ⇥

d3.selectAll('')

    .data()




**margin** ⇥

var margin = { top: 10, right: 10, bottom: 10, left: 10 };

    width = 960 - margin.left - margin.right,

    height = 640 - margin.top - margin.bottom;


var svg = d3.select('body').append('svg')

    .attr('width', width + margin.left + margin.right)

    .attr('height', height + margin.top + margin.bottom)

  .append('g')

    .attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');



## Data

**dsv** ⇥ `var dsv = d3.dsv(';', 'text/plain');`

**csv** ⇥

d3.csv('/', function(d) {

  return {


  };

}, function(err, rows) {

});



**json** ⇥

d3.json('/', function(err, data) {


});



## SVG shapes

**circle** ⇥

.enter().append('circle')

    .attr('cx', )

    .attr('cy', )

    .attr('r', )

    .style('fill', '#000');



**ellipse** ⇥

.enter().append('ellipse')

    .attr('cx', )

    .attr('cy', )

    .attr('rx', )

    .attr('ry', )

    .style('fill', '#000');



**line** ⇥

.enter().append('line')

    .attr('x1', )

    .attr('y1', )

    .attr('x2', )

    .attr('y2', )

    .style('stroke', '#000');



**rect** ⇥

.enter().append('rect')

    .attr('x', )

    .attr('y', )

    .attr('width', )

    .attr('height', )

    .attr('rx', 0)

    .attr('ry', 0)

    .style('fill', '#000');



## Geography

**map** ⇥

var projection = d3.geo.equirectangular()

    .center([0, 0])

    .scale(0)

    .translate([width / 2, height / 2]);


var path = d3.geo.path()

    .projection(projection);



## Functions

**fd** ⇥ `function(d) { return ; }`

**fdi** ⇥ `function(d, i) { return ; }`

**fn** ⇥ `function() { return ; }`

## Miscellaneous

**scale** ⇥ `d3.scale.linear().domain([]).range([]);`

**nest** ⇥

var nest = d3.nest()

    .key(function(d) { return d; })

    .entries([]);



**locale** ⇥

var d3.locale.en_US = d3.locale({

  'decimal': '.',

  'thousands': ',',

  'grouping': [3],

  'currency': ['\$', ''],

  'dateTime': '%a %b %e %X %Y',

  'date': '%m/%d/%Y',

  'time': '%H:%M:%S',

  'periods': ['AM', 'PM'],

  'days': ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],

  'shortDays': ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],

  'months': ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],

  'shortMonths': ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

});