more progress on sparkline, it is actually broken right now, but much closer to where i want it to be, will fix in the am

src/models/sparklinePlus.js

@@ -13,6 +13,7 @@ nv.models.sparklinePlus = function() {
     , x
     , y
     , color = nv.utils.defaultColor()
+    , index
     , xTickFormat = d3.format(',r')
     , yTickFormat = d3.format(',.2f')
     , noData = "No Data Available."
@@ -69,6 +70,7 @@ nv.models.sparklinePlus = function() {
       var g = wrap.select('g');
 
       gEnter.append('g').attr('class', 'nv-sparklineWrap')
+      gEnter.append('g').attr('class', 'nv-hoverArea');
 
       wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
 
@@ -91,43 +93,50 @@ nv.models.sparklinePlus = function() {
       //------------------------------------------------------------
 
 
-      var hoverValue = gEnter.append('g').attr('class', 'nv-hoverValue');
-      var hoverArea = gEnter.append('g').attr('class', 'nv-hoverArea');
+      var hoverArea = gEnter.select('.nv-hoverArea');
 
+      hoverArea.append('rect')
+          .attr('width', availableWidth)
+          .attr('height', availableHeight)
+          .on('mousemove', sparklineHover);
+
+      index = data.length - 1;
+
+      var hoverValue = g.selectAll('.nv-hoverValue').data([index]);
 
-      hoverValue.attr('transform', function(d) { return 'translate(' + x(d) + ',0)' });
+      var hoverG = hoverValue.enter().append('g').attr('class', 'nv-hoverValue');
 
-      var hoverLine = hoverValue.append('line')
-          .attr('x1', x.range()[1])
+      hoverValue.attr('transform', function(d) { return 'translate(' + x(sparkline.x()(data[d],d)) + ',0)' });
+
+      var hoverLine = hoverG.append('line')
+          .attr('x1', 0)
           .attr('y1', -margin.top)
-          .attr('x2', x.range()[1])
+          .attr('x2', 0)
           .attr('y2', availableHeight);
 
-      var hoverX = hoverValue.append('text').attr('class', 'nv-xValue')
+      var hoverX = hoverG.append('text').attr('class', 'nv-xValue')
           .attr('text-anchor', 'end')
           .attr('dy', '.9em');
 
-      var hoverY = hoverValue.append('text').attr('class', 'nv-yValue')
+      var hoverY = hoverG.append('text').attr('class', 'nv-yValue')
           //.attr('transform', function(d) { return 'translate(' + x(d) + ',0)' })
           .attr('text-anchor', 'start')
           .attr('dy', '.9em');
 
 
-      hoverArea.append('rect')
-          .attr('width', availableWidth)
-          .attr('height', availableHeight)
-          .on('mousemove', sparklineHover);
-
 
 
       function sparklineHover() {
         var pos = d3.event.offsetX - margin.left;
 
-        hoverLine
+        /*
+        hoverValue.select('line')
             .attr('x1', pos)
             .attr('x2', pos);
+           */
 
-        hoverX
+        //hoverX
+        hoverValue.select('.nv-xValue')
             .attr('transform', function(d) { return 'translate(' + (pos - 6) + ',' + (-margin.top) + ')' })
             .text(xTickFormat(Math.round(x.invert(pos))));
 
@@ -143,7 +152,8 @@ nv.models.sparklinePlus = function() {
           return closestIndex;
         }
 
-        hoverY
+        //hoverY
+        hoverValue.select('.nv-yValue')
             .attr('transform', function(d) { return 'translate(' + (pos + 6) + ',' + (-margin.top) + ')' })
             .text(yTickFormat(sparkline.y()(data[f(data, Math.round(x.invert(pos)))])));
       }