Skip to content
Browse files

Line graph added using d3.svg.line, both vertical and horizontal

  • Loading branch information...
1 parent 2dcb255 commit d1081ab2c3dad1a79bef96ed2a58b4d96f1379bc @hashd committed
Showing with 69 additions and 0 deletions.
  1. +69 −0 src/line.js
View
69 src/line.js
@@ -0,0 +1,69 @@
+cv.linegraph = function (graphdef) {
+ cv.graph.apply(this, [graphdef]);
+ graphdef.stepup = false;
+ graphdef.orientation = 'ver';
+ this.init(graphdef);
+
+ this.linegroups = [];
+ this.dataset = r3.util.getDataArray(this.graphdef.dataset);
+
+ var linegroup, linepath, linefunc,
+ domainData = this.graphdef.dataset[0].data;
+
+ this.axes[this.graphdef.orientation === 'hor'?'ver':'hor'].scale.domain(domainData.map(function(d){ return d.name;}));
+
+ for(var idx=0, len=this.dataset.length; idx<len; idx++){
+ linegroup = this.panel.append('g').attr('class','chart3rline');
+ linepath = linegroup.append('g').attr('class','line_' + idx); linepath.datum(this.dataset[idx]);
+ this['draw' + r3.util.getPascalCasedName(this.graphdef.orientation) + 'Lines'](linepath, idx);
+ this.linegroups.push(linegroup);
+ }
+
+ this.finalize();
+};
+
+cv.linegraph.prototype = cv.extend(cv.graph);
+
+cv.linegraph.prototype.drawHorLines = function (linepath, idx) {
+ var axes = this.axes;
+
+ var line = d3.svg.line()
+ .x(function(d) { return axes.hor.scale(d.value); })
+ .y(function(d) { return axes.ver.scale(d.name) + axes.ver.scale.rangeBand()/2; })
+ .interpolate("linear");
+
+ var path = linepath.append("svg:path")
+ .attr("class", "linepath_" + idx)
+ .attr("d", line);
+
+ linepath.selectAll(".dot")
+ .data(this.dataset[idx])
+ .enter()
+ .append("circle")
+ .attr("class", "dot")
+ .attr("cx", line.x())
+ .attr("cy", line.y())
+ .attr("r", 3.5).style("fill","white");
+};
+
+cv.linegraph.prototype.drawVerLines = function (linepath, idx) {
+ var axes = this.axes, height = this.dimension.height;
+
+ var line = d3.svg.line()
+ .x(function(d) { return axes.hor.scale(d.name) + axes.hor.scale.rangeBand()/2; })
+ .y(function(d) { return axes.ver.scale(d.value); })
+ .interpolate("linear");
+
+ var path = linepath.append("svg:path")
+ .attr("class", "linepath_" + idx)
+ .attr("d", line);
+
+ linepath.selectAll(".dot")
+ .data(this.dataset[idx])
+ .enter()
+ .append("circle")
+ .attr("class", "dot")
+ .attr("cx", line.x())
+ .attr("cy", line.y())
+ .attr("r", 3.5).style("fill","white");
+};

0 comments on commit d1081ab

Please sign in to comment.
Something went wrong with that request. Please try again.