[Pkg-javascript-commits] [d3-tip.js] 36/277: every matrix and bounding box in svg and I think I've found something that works

[bhuvan krishna]

This is an automated email from the git hooks/post-receive script.

bhuvan-guest pushed a commit to branch master
in repository d3-tip.js.

commit d46ba8ab9246c8a6118c8526910dd6b3b3ce0fd8
Author: Caged <justin at labratrevenge.com>
Date:   Tue Feb 7 14:32:47 2012 -0800

    every matrix and bounding box in svg and I think I've found something that works
---
 examples/nested-groups.html | 43 +++++++++++++++++++++++++++++++++++++++++--
 src/d3.tip.js               |  1 +
 2 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/examples/nested-groups.html b/examples/nested-groups.html
index 13d7272..78e1f15 100644
--- a/examples/nested-groups.html
+++ b/examples/nested-groups.html
@@ -6,6 +6,10 @@
     <script type="text/javascript" src="../vendor/d3.layout.js"></script>
     <script type="text/javascript" src="../src/d3.tip.js"></script>
     <style type="text/css">
+      body {
+        padding: 100px;
+      }
+
       path.domain {
         display: none;
       }
@@ -67,7 +71,6 @@
       tip = d3.svg.tip()
         .orient('top')
         .padding(4)
-        .offset([20, 20])
         .text(function(d) { return d; })
         .attr('class', 'd3-tip');
 
@@ -104,7 +107,27 @@
       .attr('width', x.rangeBand())
       .attr('height', function(d) { return h - y(d) })
       .attr('y', function(d) { return y(d) })
-      .on('mouseover', tip)
+      .on('mouseover', function(d) {
+        d3.select(this).style('fill', 'red')
+        var rect = this.getBoundingClientRect(),
+            bbox = this.getBBox(),
+            // trans = this.getTransformToElement(),
+            scree = this.getScreenCTM(),
+            ctm   = this.getCTM(),
+            x = ctm.e - ctm.f + (bbox.width / 2),
+            y = bbox.y;
+
+        linex.transition()
+          .attr('x1', x)
+          .attr('x2', x)
+
+        liney.transition()
+          .attr('y1', y)
+          .attr('y2',y)
+      })
+      .on('mouseout', function(d) {
+        d3.select(this).style('fill', '#2892eb')
+      })
 
     vis.append('g')
       .attr('class', 'x axis')
@@ -112,6 +135,22 @@
       .call(xAxis)
     .selectAll('.x.axis g')
       .style('display', function(d, i) { return i % 3 != 0 ? 'none' : 'block' })
+
+
+    // debugging stuff
+    var linex = vis.append('line')
+      .attr("x1", 0)
+      .attr("y1", 0)
+      .attr("x2", 0)
+      .attr("y2", h)
+      .attr('class', 'rule')
+
+    var liney = vis.append('line')
+      .attr("x1", 0)
+      .attr("y1", 0)
+      .attr("x2", w)
+      .attr("y2", 0)
+      .attr('class', 'rule')
   })
   </script>
   </body>
diff --git a/src/d3.tip.js b/src/d3.tip.js
index 1597c73..ebcc4bd 100644
--- a/src/d3.tip.js
+++ b/src/d3.tip.js
@@ -60,6 +60,7 @@ d3.svg.tip = function() {
       top: function() {
         stem.attr('transform', 'translate(' + (backingRect.width / 2) + ',' + backingRect.height + ')');
         containerRect = container.node().getBBox()
+
         x = targetRect.x + (targetRect.width / 2) - (containerRect.width / 2) + tipOffset[0];
         y = targetRect.y - containerRect.height + tipOffset[1];
 

-- 
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-javascript/d3-tip.js.git