From 597443b3b0b723943e70dd3fb3e326aa253b582c Mon Sep 17 00:00:00 2001
From: Mike Bostock <mbostock@gmail.com>
Date: Sun, 10 Apr 2011 18:37:23 -0700
Subject: [PATCH] Rotate text by 180 when upside-down.

---
 examples/tree/tree-radial.js | 7 ++++---
 examples/tree/tree.css       | 7 +++----
 examples/tree/tree.js        | 2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/examples/tree/tree-radial.js b/examples/tree/tree-radial.js
index d7e1d21e..192f8fc5 100644
--- a/examples/tree/tree-radial.js
+++ b/examples/tree/tree-radial.js
@@ -2,7 +2,7 @@ var r = 960 / 2;
 
 var tree = d3.layout.tree()
     .size([360, r - 120])
-    .sort(function(a, b) { return d3.ascending(a.data.key, b.data.key); })
+    .sort(null)
     .children(function(d) { return isNaN(d.value) ? d3.entries(d.value) : null; })
     .separation(function(a, b) { return (a.parent == b.parent ? 1 : 2) / a.depth; });
 
@@ -35,12 +35,13 @@ d3.json("flare.json", function(json) {
       .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })
 
   node.append("svg:circle")
-      .attr("class", "node")
       .attr("r", 5);
 
   node.append("svg:text")
-      .attr("dx", 8)
+      .attr("dx", function(d) { return d.x < 180 ? 8 : -8; })
       .attr("dy", ".31em")
+      .attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
+      .attr("transform", function(d) { return d.x < 180 ? null : "rotate(180)"; })
       .text(function(d) { return d.data.key; });
 
   // Returns parent+child objects for any children of `d`.
diff --git a/examples/tree/tree.css b/examples/tree/tree.css
index dd22ce63..75511723 100644
--- a/examples/tree/tree.css
+++ b/examples/tree/tree.css
@@ -1,12 +1,11 @@
-circle.node {
+.node circle {
   fill: #fff;
   stroke: steelblue;
   stroke-width: 1.5px;
 }
 
-g.node {
-  font-size: .7em;
-  font-family: sans-serif;
+.node {
+  font: 10px sans-serif;
 }
 
 .link {
diff --git a/examples/tree/tree.js b/examples/tree/tree.js
index 4365d1f5..6c56c4a2 100644
--- a/examples/tree/tree.js
+++ b/examples/tree/tree.js
@@ -3,6 +3,7 @@ var w = 960,
 
 var tree = d3.layout.tree()
     .size([h, w - 160])
+    .sort(null)
     .children(function(d) { return isNaN(d.value) ? d3.entries(d.value) : null; });
 
 var vis = d3.select("body").append("svg:svg")
@@ -34,7 +35,6 @@ d3.json("flare.json", function(json) {
       .attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; })
 
   node.append("svg:circle")
-      .attr("class", "node")
       .attr("r", 5);
 
   node.append("svg:text")