             d.b = d.oy = d.y + 5;
             d.t = d.y - bbox.height - 5 ;
             
-            /* check whether the default position 
-               overlaps any other labels*/
-            var conflicts = [];
+            # check whether the default position 
+            #   overlaps any other labels
+            conflicts = [];
             labelLayout.visit((node, x1, y1, x2, y2) -> 
-                //recurse down the tree, adding any overlapping 
-                //node is the node in the quadtree, 
-                //node.point is the value that we added to the tree
-                //x1,y1,x2,y2 are the bounds of the rectangle that
-                //this node covers
+                #recurse down the tree, adding any overlapping 
+                #node is the node in the quadtree, 
+                #node.point is the value that we added to the tree
+                #x1,y1,x2,y2 are the bounds of the rectangle that
+                #this node covers
                 
                 if (  (x1 > d.r + maxLabelWidth/2) 
-                        //left edge of node is to the right of right edge of label
+                        #left edge of node is to the right of right edge of label
                     ||(x2 < d.l - maxLabelWidth/2) 
-                        //right edge of node is to the left of left edge of label
+                        #right edge of node is to the left of left edge of label
                     ||(y1 > d.b + maxLabelHeight/2)
-                        //top (minY) edge of node is greater than the bottom of label
+                        #top (minY) edge of node is greater than the bottom of label
                     ||(y2 < d.t - maxLabelHeight/2 ) )
-                        //bottom (maxY) edge of node is less than the top of label
+                        #bottom (maxY) edge of node is less than the top of label
                     
-                      return true; //don't bother visiting children or checking this node
+                      return true; #don't bother visiting children or checking this node
                 
-                var p = node.point;
-                var v = false, h = false;
-                if ( p ) { //p is defined, i.e., there is a value stored in this node
+                p = node.point;
+                v = false, h = false;
+                if ( p ) { #p is defined, i.e., there is a value stored in this node
                     h =  ( ((p.l > d.l) && (p.l <= d.r))
                        || ((p.r > d.l) && (p.r <= d.r)) 
                        || ((p.l < d.l)&&(p.r >=d.r) ) ); //horizontal conflict

        }
        //Create/select <g> elements to hold the different types of graphics
        //and keep them in the correct drawing order
        var pathGroup = this.svg.select("g.piePaths");
        if (pathGroup.empty() ){
            pathGroup = this.svg.append("g")
                       .attr("class", "piePaths");
        }
        var pointerGroup = this.svg.select("g.pointers")
        if (pointerGroup.empty() ) {
            pointerGroup = this.svg.append("g")
                           .attr("class", "pointers");
        }
        var labelGroup = this.svg.select("g.labels")
        if (labelGroup.empty() ) {
            labelGroup = this.svg.append("g")
                         .attr("class", "labels");

    update: (data) ->
        console.log("update pie", data);

        that = this;

        this.piedata = this.pie(data);

        //create a marker element if it doesn't already exist
        defs = this.svg.select("defs");
        if (defs.empty() ) {
            defs = this.svg.append("defs");            
        }
        marker = defs.select("marker#circ");
        if (marker.empty() ) {
            defs.append("marker")
            .attr("id", "circ")
