projects / tech-radar.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 7c865b4)
initializing the graph in a DOM node
authorBruno Trecenti <btrecent@thoughtworks.com>
Thu, 27 Feb 2014 14:46:12 +0000 (11:46 -0300)
committerBruno Trecenti <btrecent@thoughtworks.com>
Thu, 27 Feb 2014 14:46:12 +0000 (11:46 -0300)
examples/default.html patch | blob | history
src/graphing/radar.js patch | blob | history
test/graphing/radar-spec.js patch | blob | history

diff --git a/examples/default.html b/examples/default.html
index 5ff1932..9292e47 100644 (file)
--- a/examples/default.html
+++ b/examples/default.html
@@ -71,6 +71,8 @@
   </style>
 </head>
 <body>
+  <div id="radar">
+  </div>
 </body>
 <script>
   var adopt = new tr.models.Cycle('Adopt', 0);
@@ -193,6 +195,6 @@
   radar.setFourthQuadrant(languageFramework);
 
   var radarGraph = new tr.graphing.Radar(800, radar);
-  radarGraph.plot();
+  radarGraph.init('#radar').plot();
 </script>
 </html>
diff --git a/src/graphing/radar.js b/src/graphing/radar.js
index dd3abe0..e588663 100644 (file)
--- a/src/graphing/radar.js
+++ b/src/graphing/radar.js
@@ -1,11 +1,12 @@
 tr.graphing.Radar = function (size, radar) {
   var self, fib, svg;
 
-  svg = d3.select("body").append("svg");
   fib = new tr.util.Fib();
 
   self = {};
-  self.svg = svg;
+  self.svg = function () {
+    return svg;
+  }
 
   function center () {
     return Math.round(size/2);
@@ -155,6 +156,11 @@ tr.graphing.Radar = function (size, radar) {
     plotName(quadrants.IV.name(), 'end', size -10, size - 10)
   }
 
+  self.init = function (selector) {
+    svg = d3.select(selector || 'body').append("svg");
+    return self;
+  };
+
   self.plot = function () {
     var cycles, quadrants;
 
diff --git a/test/graphing/radar-spec.js b/test/graphing/radar-spec.js
index 5d38842..3a38292 100644 (file)
--- a/test/graphing/radar-spec.js
+++ b/test/graphing/radar-spec.js
@@ -6,11 +6,49 @@ describe('tr.graphing.Radar', function () {
     spyOn(radar, 'cycles').andReturn([]);
   });
 
+  describe('init', function () {
+    it('appends the svg', function () {
+      var radarGraph, selection;
+
+      radarGraph = new tr.graphing.Radar(500, radar);
+      selection = { append: jasmine.createSpy() };
+      spyOn(d3, 'select').andReturn(selection);
+
+      radarGraph.init();
+
+      expect(selection.append).toHaveBeenCalledWith('svg');
+    });
+
+    it('selects body if no selector provided', function () {
+      var radarGraph;
+
+      radarGraph = new tr.graphing.Radar(500, radar);
+      spyOn(d3, 'select').andCallThrough();
+
+      radarGraph.init();
+
+      expect(d3.select).toHaveBeenCalledWith('body');
+    });
+
+    it('selects the selector if provided', function () {
+      var radarGraph;
+
+      radarGraph = new tr.graphing.Radar(500, radar);
+      spyOn(d3, 'select').andCallThrough();
+
+      radarGraph.init('#radar');
+
+      expect(d3.select).toHaveBeenCalledWith('#radar');
+    });
+  });
+
   it('sets the size', function () {
     var svg, radarGraph;
 
     radarGraph = new tr.graphing.Radar(500, radar);
-    svg = radarGraph.svg;
+    radarGraph.init();
+
+    svg = radarGraph.svg();
     spyOn(svg, 'attr').andReturn(svg);
 
     radarGraph.plot();
@@ -24,8 +62,9 @@ describe('tr.graphing.Radar', function () {
       var radarGraph, svg;
 
       radarGraph = new tr.graphing.Radar(500, radar);
+      radarGraph.init();
 
-      svg = radarGraph.svg;
+      svg = radarGraph.svg();
       spyOn(svg, 'append').andReturn(svg);
       spyOn(svg, 'attr').andReturn(svg);
 
@@ -43,7 +82,9 @@ describe('tr.graphing.Radar', function () {
       var svg, radarGraph;
 
       radarGraph = new tr.graphing.Radar(500, radar);
-      svg = radarGraph.svg;
+      radarGraph.init();
+
+      svg = radarGraph.svg();
       spyOn(svg, 'append').andReturn(svg);
       spyOn(svg, 'attr').andReturn(svg);
 
@@ -70,7 +111,9 @@ describe('tr.graphing.Radar', function () {
         new tr.models.Cycle('Hold')
       ]);
       radarGraph = new tr.graphing.Radar(500, radar);
-      svg = radarGraph.svg;
+      radarGraph.init();
+
+      svg = radarGraph.svg();
       spyOn(svg, 'append').andReturn(svg);
       spyOn(svg, 'attr').andReturn(svg);
     });
A fork of https://github.com/trecenti/tech-radar with CSV input support