Permalink
Browse files

Sort chart lines so the active line is "above" the non-hovered lines

  • Loading branch information...
1 parent 526078d commit 5f6f2fb4446b810ca405dd64a5a2c87b890ffde7 @matthewhudson matthewhudson committed Apr 12, 2013
Showing with 14 additions and 3 deletions.
  1. +8 −2 sixpack/static/js/chart.js
  2. +6 −1 sixpack/static/js/experiment.js
View
@@ -94,6 +94,9 @@ $(function () {
my.svg.select("#" + line_id)
.data(data)
.on("mouseover", function (d) {
+ // Sort the lines so the current line is "above" the non-hovered lines
+ d3.select(this.parentNode.appendChild(this));
+
// Highlight line
var currClass = d3.select(this).attr("class");
d3.select(this).attr("class", currClass + " line-hover");
@@ -102,7 +105,6 @@ $(function () {
var table = $('.' + d3.event.target.id).closest('div').find('table')
table.find('tr').removeClass('highlight');
table.find('.' + d3.event.target.id).addClass('highlight');
-
})
.on("mouseout", function (d) {
// Remove line highlight
@@ -126,7 +128,11 @@ $(function () {
.attr("r", 5)
.attr("cx", function(d) { return my.xScale(d.date); })
.attr("cy", function(d) { return my.yScale(d.close); })
- .attr("style", "fill:" + color);
+ .attr("style", "fill:" + color)
+ .on("mouseover", function (d) {
+ // Sort the lines so the current line is "above" the non-hovered lines
+ d3.select(this.parentNode.appendChild(this));
+ });
};
my.drawArea = function (data) {
@@ -47,14 +47,19 @@ $(function () {
if (!alt_name) return;
$(this).addClass('highlight');
-
+
var line = d3.select("#" + alt_name);
var id = line.attr('id');
+ var el = d3.select('#' + id)[0][0];
+
if (line.attr('class') === 'circle') {
line.attr('r', 7);
} else {
line.attr('class', line.attr('class') + " line-hover");
}
+
+ // Sort the lines so the current line is "above" the non-hovered lines
+ el.parentNode.appendChild(el);
},
function () {
$(this).removeClass('highlight');

0 comments on commit 5f6f2fb

Please sign in to comment.