mongodb: add comments to the coffeescript script

mongodb/anscombe.coffee

@@ -1,11 +1,11 @@
 # plot Anscombe's quartet, with mongoDB on the back end
 
-height = 500
-width  = 800
-left_width = 80
-gap = 10
-button_size = 20
-rad = 3
+height = 500      # height of right panel
+width  = 800      # width of right panel
+left_width = 80   # width of left bit, with the buttons
+gap = 10          # gap to left of buttons
+button_size = 20  # width of buttons
+rad = 3           # radius of circles in main plot
 color = "#6A5ACD" # slateblue
 hilit = "#C71585" # violetred
 margin = {left:60, top:40, right:40, bottom:40, inner:5}
@@ -16,10 +16,11 @@ svg = d3.select("div#chart")
         .attr("height", height)
         .attr("width", width + left_width)
 
-
+# the four sets, and where the buttons will go
 sets = ["I", "II", "III", "IV"]
 y = (margin.top + i*button_size*1.5 for i of sets)
 
+# add the four buttons
 svg.selectAll("empty")
    .data(sets)
    .enter()
@@ -31,8 +32,9 @@ svg.selectAll("empty")
    .attr("fill", color)
    .on("mouseover", (d) -> d3.select(this).attr("fill", hilit))
    .on("mouseout", (d) -> d3.select(this).attr("fill", color))
-   .on("click", (d) -> make_plot(d))
+   .on("click", (d) -> make_plot(d)) # <- click a button and make the plot
 
+# add text next to the buttons
 svg.selectAll("empty")
    .data(sets)
    .enter()
@@ -44,6 +46,8 @@ svg.selectAll("empty")
    .style("text-anchor", "middle")
    .style("font-size", "20px")
 
+# function to create the scatterplot
+# (see http://kbroman.org/d3panels)
 myscatter = scatterplot().xvar("x")
                          .yvar("y")
                          .xlab("X")
@@ -56,6 +60,10 @@ myscatter = scatterplot().xvar("x")
                          .pointsize(rad)
                          .pointcolor(color)
 
+# function that actually makes the plot of one of the 4 sets
+#   - the URL passed to d3.json causes the request to the database, and data as JSON back
+#   - we remove previous plot and any d3-tip objects
+#   - then make the scatterplot
 make_plot = (set) ->
     d3.json("http://localhost:8080/anscombe/#{set}", (data) ->
         d3.select("svg#scatterplot").remove()