src/graphing/radar.js

   1 tr.graphing.Radar = function (svg, size, radar) {
   2   var self = {};
   3
   4   svg.attr('width', size).attr('height', size);
   5
   6   function center () {
   7     return Math.round(size/2);
   8   }
   9
  10   function plotLines() {
  11     svg.append('line')
  12       .attr('x1', center())
  13       .attr('y1', 0)
  14       .attr('x2', center())
  15       .attr('y2', size)
  16       .attr('stroke-width', 14);
  17
  18     svg.append('line')
  19       .attr('x1', 0)
  20       .attr('y1', center())
  21       .attr('x2', size)
  22       .attr('y2', center())
  23       .attr('stroke-width', 14);
  24   };
  25
  26   function plotCircles(cycles) {
  27     var increment;
  28
  29     increment = Math.round(center() / cycles.length);
  30
  31     cycles.forEach(function (cycle, i) {
  32       svg.append('circle')
  33         .attr('cx', center())
  34         .attr('cy', center())
  35         .attr('r', center() - increment * i);
  36     });
  37   }
  38
  39   function plotTexts(cycles) {
  40     var increment;
  41
  42     increment = Math.round(center() / cycles.length);
  43
  44     cycles.forEach(function (cycle, i) {
  45       svg.append('text')
  46         .attr('y', center() + 4)
  47         .attr('x', (i * increment) + 10)
  48         .text(cycle.name());
  49
  50       svg.append('text')
  51         .attr('y', center() + 4)
  52         .attr('x', size - (i * increment) - 10)
  53         .attr('text-anchor', 'end')
  54         .text(cycle.name());
  55     });
  56   };
  57
  58   self.plot = function () {
  59     var cycles = radar.cycles().reverse();
  60
  61     plotCircles(cycles);
  62     plotLines();
  63     plotTexts(cycles);
  64   };
  65
  66   return self;
  67 };