1 
  2 /**
  3  * @fileoverview Simple hoop chart implementation.
  4  * @version 1.0.1
  5  * @see https://google.github.io/styleguide/jsguide.html
  6  * @see https://github.com/google/closure-compiler/wiki
  7  */
  8 
  9 
 10 
 11 /**
 12  * HoopChart constructor.
 13  * @param {string|Element} container The HTML container.
 14  * @constructor
 15  * @extends {charts.DonutChart} charts.DonutChart
 16  * @example
 17  * <b>var</b> chart = <b>new</b> charts.HoopChart('container_id');
 18  * chart.draw([['Work', 'Eat', 'Commute', 'Watch TV', 'Sleep'],
 19  *             [100, 50, 30, 10, 40], [140, 2, 110, 150, 1300]]);
 20  *
 21  * <div style="border: solid 1px #ccc; margin: 5px; padding: 5px; width: 560px">
 22  *   <div id="chart-container"
 23  *        style="width: 560px; height: 300px;"></div>
 24  * </div>
 25  * <script src="https://greylock.js.org/greylock.js"></script>
 26  * <script>
 27  *   var chart = new charts.HoopChart('chart-container');
 28  *   chart.draw([['Work', 'Eat', 'Commute', 'Watch TV', 'Sleep'],
 29  *               [100, 50, 30, 10, 40], [140, 2, 110, 150, 1300]]);
 30  * </script>
 31  */
 32 charts.HoopChart = function(container) {
 33   charts.DonutChart.apply(this, arguments);
 34 
 35   /**
 36    * Saved reference to charts.DonutChart.draw method.
 37    * @type {!function(!Array.<Array>, Object=)}
 38    * @private
 39    */
 40   var draw_ = this.draw;
 41 
 42   /**
 43    * Draws the chart based on <code>data</code> and <code>opt_options</code>.
 44    * @param {!Array.<Array>} data A chart data.
 45    * @param {Object=} opt_options A optional chart's configuration options.
 46    * @see charts.DonutChart#draw
 47    * @see charts.PieChart#draw
 48    * @see charts.BaseChart#getOptions
 49    * @override
 50    * @example
 51    * options: {
 52    *   'hoop': {'radius': 0.85}
 53    *   'animation': {'radius': 1}
 54    * }
 55    */
 56   this.draw = function(data, opt_options) {
 57     options_ = getOptions_(opt_options);
 58     draw_(data, options_);
 59 
 60     // The timeout is waitings for charts.PieChart event initialization.
 61     setTimeout(function() {
 62       /** @type {string} */
 63       var tagName = charts.IS_SVG_SUPPORTED ? 'text' : 'textbox';
 64       /** @type {NodeList} */
 65       var nodes = dom.getElementsByTagName(self_.container, tagName);
 66       for (/** @type {number} */ var i = nodes.length - 1; i >= 0; --i) {
 67         nodes[i].parentNode.removeChild(nodes[i]);
 68       }
 69     }, 100);
 70   };
 71 
 72   // Export for closure compiler.
 73   this['draw'] = this.draw;
 74 
 75   /**
 76    * Gets circle area content.
 77    * @return {string} Returns circle area content.
 78    * @protected
 79    * @override
 80    */
 81   this.getAreaContent = function() {
 82     /** @type {string} */
 83     var content = '<div style="color:#aaa;font-size:15px">Example of</div>' +
 84                   '<div style="color:#666;font-size:18px"><b>' +
 85                   'HoopChart' + '</b></div>';
 86     return content;
 87   };
 88 
 89   // Export for closure compiler.
 90   this['getAreaContent'] = this.getAreaContent;
 91 
 92   /**
 93    * Gets chart's options merged with defaults chart's options.
 94    * @param {Object=} opt_options A optional chart's configuration options.
 95    * @return {!Object.<string, *>} A map of name/value pairs.
 96    * @see charts.BaseChart#getOptions
 97    * @private
 98    * @example
 99    * options: {
100    *   'hoop': {'radius': 0.85}
101    *   'animation': {'radius': 1}
102    * }
103    */
104   function getOptions_(opt_options) {
105     opt_options = opt_options || {};
106     opt_options['hoop'] = opt_options['hoop'] || {};
107     opt_options['donut'] = opt_options['donut'] || {};
108     opt_options['donut']['radius'] = opt_options['hoop']['radius'] || 0.85;
109     opt_options['animation'] = opt_options['animation'] || {};
110     opt_options['animation']['radius'] =
111         opt_options['animation']['radius'] || 1;
112     return self_.getOptions(opt_options);
113   }
114 
115   /**
116    * The reference to current class instance. Used in private methods.
117    * @type {!charts.HoopChart}
118    * @private
119    */
120   var self_ = this;
121 
122   /**
123    * @dict
124    * @private
125    */
126   var options_ = null;
127 };
128 
129 // Export for closure compiler.
130 charts['HoopChart'] = charts.HoopChart;
131