Skip to content

Instantly share code, notes, and snippets.

@bclinkinbeard
Created May 15, 2012 01:15
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save bclinkinbeard/2698389 to your computer and use it in GitHub Desktop.
Save bclinkinbeard/2698389 to your computer and use it in GitHub Desktop.
D3.js scatterplot in CoffeeScript
dataset = []
w = 500
h = 400
padding = 30
dataset.push [ Math.random() * w, Math.random() * h ] for [0..50]
svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h)
circles = svg.selectAll("circle")
.data(dataset)
.enter()
.append("circle")
xScale = d3.scale.linear()
.domain([0, d3.max(dataset, (d) -> d[0])])
.range([padding, w - padding * 2.5])
xAxis = d3.svg.axis()
.scale(xScale)
.orient("bottom")
.ticks(5)
yScale = d3.scale.linear()
.domain([0, d3.max(dataset, (d) -> d[1])])
.range([h - padding, padding])
yAxis = d3.svg.axis()
.scale(yScale)
.orient("left")
.ticks(5)
rScale = d3.scale.linear()
.domain([0, d3.max(dataset, (d) -> d[1] )])
.range([2, 8])
circles.attr("cx", (d) -> xScale d[0])
circles.attr("cy", (d) -> yScale d[1])
circles.attr("r", (d) -> rScale d[1])
svg.append("g")
.attr("class", "axis")
.attr("transform", "translate(0, #{h - padding})")
.call(xAxis)
svg.append("g")
.attr("class", "axis")
.attr("transform", "translate(#{padding}, 0)")
.call(yAxis)
@TrevorBurnham
Copy link

The indentation for continued lines is haphazard. There's isn't really a standard style, but stick one and pick with it.

Many CoffeeScripters (jashkenas included) like to line up = for assignments, e.g.

dataset = []
w       = 500
h       = 400
padding = 30

@bclinkinbeard
Copy link
Author

Good point. Multi-lined method chains are not really something I've dealt with in the past and I am still making up my mind on how I think they should look/be aligned.

As for lining up =, that has always seemed like a good way to create extra work for myself for which I've never understood the appeal. Adding a new, long variable name means you have to go edit every line you already had aligned, and that seems like a huge waste of time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment