jqplot.tableLegendRenderer.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323
  1. /**
  2. * jqPlot
  3. * Pure JavaScript plotting plugin using jQuery
  4. *
  5. * Version: @VERSION
  6. * Revision: @REVISION
  7. *
  8. * Copyright (c) 2009-2013 Chris Leonello
  9. * jqPlot is currently available for use in all personal or commercial projects
  10. * under both the MIT (http://www.opensource.org/licenses/mit-license.php) and GPL
  11. * version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html) licenses. This means that you can
  12. * choose the license that best suits your project and use it accordingly.
  13. *
  14. * Although not required, the author would appreciate an email letting him
  15. * know of any substantial use of jqPlot. You can reach the author at:
  16. * chris at jqplot dot com or see http://www.jqplot.com/info.php .
  17. *
  18. * If you are feeling kind and generous, consider supporting the project by
  19. * making a donation at: http://www.jqplot.com/donate.php .
  20. *
  21. * sprintf functions contained in jqplot.sprintf.js by Ash Searle:
  22. *
  23. * version 2007.04.27
  24. * author Ash Searle
  25. * http://hexmen.com/blog/2007/03/printf-sprintf/
  26. * http://hexmen.com/js/sprintf.js
  27. * The author (Ash Searle) has placed this code in the public domain:
  28. * "This code is unrestricted: you are free to use it however you like."
  29. *
  30. */
  31. (function($) {
  32. // class $.jqplot.TableLegendRenderer
  33. // The default legend renderer for jqPlot.
  34. $.jqplot.TableLegendRenderer = function(){
  35. //
  36. };
  37. $.jqplot.TableLegendRenderer.prototype.init = function(options) {
  38. $.extend(true, this, options);
  39. };
  40. $.jqplot.TableLegendRenderer.prototype.addrow = function (label, color, pad, reverse) {
  41. var rs = (pad) ? this.rowSpacing+'px' : '0px';
  42. var tr;
  43. var td;
  44. var elem;
  45. var div0;
  46. var div1;
  47. elem = document.createElement('tr');
  48. tr = $(elem);
  49. tr.addClass('jqplot-table-legend');
  50. elem = null;
  51. if (reverse){
  52. tr.prependTo(this._elem);
  53. }
  54. else{
  55. tr.appendTo(this._elem);
  56. }
  57. if (this.showSwatches) {
  58. td = $(document.createElement('td'));
  59. td.addClass('jqplot-table-legend jqplot-table-legend-swatch');
  60. td.css({textAlign: 'center', paddingTop: rs});
  61. div0 = $(document.createElement('div'));
  62. div0.addClass('jqplot-table-legend-swatch-outline');
  63. div1 = $(document.createElement('div'));
  64. div1.addClass('jqplot-table-legend-swatch');
  65. div1.css({backgroundColor: color, borderColor: color});
  66. tr.append(td.append(div0.append(div1)));
  67. // $('<td class="jqplot-table-legend" style="text-align:center;padding-top:'+rs+';">'+
  68. // '<div><div class="jqplot-table-legend-swatch" style="background-color:'+color+';border-color:'+color+';"></div>'+
  69. // '</div></td>').appendTo(tr);
  70. }
  71. if (this.showLabels) {
  72. td = $(document.createElement('td'));
  73. td.addClass('jqplot-table-legend jqplot-table-legend-label');
  74. td.css('paddingTop', rs);
  75. tr.append(td);
  76. // elem = $('<td class="jqplot-table-legend" style="padding-top:'+rs+';"></td>');
  77. // elem.appendTo(tr);
  78. if (this.escapeHtml) {
  79. td.text(label);
  80. }
  81. else {
  82. td.html(label);
  83. }
  84. }
  85. td = null;
  86. div0 = null;
  87. div1 = null;
  88. tr = null;
  89. elem = null;
  90. };
  91. // called with scope of legend
  92. $.jqplot.TableLegendRenderer.prototype.draw = function() {
  93. if (this._elem) {
  94. this._elem.emptyForce();
  95. this._elem = null;
  96. }
  97. if (this.show) {
  98. var series = this._series;
  99. // make a table. one line label per row.
  100. var elem = document.createElement('table');
  101. this._elem = $(elem);
  102. this._elem.addClass('jqplot-table-legend');
  103. var ss = {position:'absolute'};
  104. if (this.background) {
  105. ss['background'] = this.background;
  106. }
  107. if (this.border) {
  108. ss['border'] = this.border;
  109. }
  110. if (this.fontSize) {
  111. ss['fontSize'] = this.fontSize;
  112. }
  113. if (this.fontFamily) {
  114. ss['fontFamily'] = this.fontFamily;
  115. }
  116. if (this.textColor) {
  117. ss['textColor'] = this.textColor;
  118. }
  119. if (this.marginTop != null) {
  120. ss['marginTop'] = this.marginTop;
  121. }
  122. if (this.marginBottom != null) {
  123. ss['marginBottom'] = this.marginBottom;
  124. }
  125. if (this.marginLeft != null) {
  126. ss['marginLeft'] = this.marginLeft;
  127. }
  128. if (this.marginRight != null) {
  129. ss['marginRight'] = this.marginRight;
  130. }
  131. var pad = false,
  132. reverse = false,
  133. s;
  134. for (var i = 0; i< series.length; i++) {
  135. s = series[i];
  136. if (s._stack || s.renderer.constructor == $.jqplot.BezierCurveRenderer){
  137. reverse = true;
  138. }
  139. if (s.show && s.showLabel) {
  140. var lt = this.labels[i] || s.label.toString();
  141. if (lt) {
  142. var color = s.color;
  143. if (reverse && i < series.length - 1){
  144. pad = true;
  145. }
  146. else if (reverse && i == series.length - 1){
  147. pad = false;
  148. }
  149. this.renderer.addrow.call(this, lt, color, pad, reverse);
  150. pad = true;
  151. }
  152. // let plugins add more rows to legend. Used by trend line plugin.
  153. for (var j=0; j<$.jqplot.addLegendRowHooks.length; j++) {
  154. var item = $.jqplot.addLegendRowHooks[j].call(this, s);
  155. if (item) {
  156. this.renderer.addrow.call(this, item.label, item.color, pad);
  157. pad = true;
  158. }
  159. }
  160. lt = null;
  161. }
  162. }
  163. }
  164. return this._elem;
  165. };
  166. $.jqplot.TableLegendRenderer.prototype.pack = function(offsets) {
  167. if (this.show) {
  168. if (this.placement == 'insideGrid') {
  169. switch (this.location) {
  170. case 'nw':
  171. var a = offsets.left;
  172. var b = offsets.top;
  173. this._elem.css('left', a);
  174. this._elem.css('top', b);
  175. break;
  176. case 'n':
  177. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  178. var b = offsets.top;
  179. this._elem.css('left', a);
  180. this._elem.css('top', b);
  181. break;
  182. case 'ne':
  183. var a = offsets.right;
  184. var b = offsets.top;
  185. this._elem.css({right:a, top:b});
  186. break;
  187. case 'e':
  188. var a = offsets.right;
  189. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  190. this._elem.css({right:a, top:b});
  191. break;
  192. case 'se':
  193. var a = offsets.right;
  194. var b = offsets.bottom;
  195. this._elem.css({right:a, bottom:b});
  196. break;
  197. case 's':
  198. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  199. var b = offsets.bottom;
  200. this._elem.css({left:a, bottom:b});
  201. break;
  202. case 'sw':
  203. var a = offsets.left;
  204. var b = offsets.bottom;
  205. this._elem.css({left:a, bottom:b});
  206. break;
  207. case 'w':
  208. var a = offsets.left;
  209. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  210. this._elem.css({left:a, top:b});
  211. break;
  212. default: // same as 'se'
  213. var a = offsets.right;
  214. var b = offsets.bottom;
  215. this._elem.css({right:a, bottom:b});
  216. break;
  217. }
  218. }
  219. else if (this.placement == 'outside'){
  220. switch (this.location) {
  221. case 'nw':
  222. var a = this._plotDimensions.width - offsets.left;
  223. var b = offsets.top;
  224. this._elem.css('right', a);
  225. this._elem.css('top', b);
  226. break;
  227. case 'n':
  228. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  229. var b = this._plotDimensions.height - offsets.top;
  230. this._elem.css('left', a);
  231. this._elem.css('bottom', b);
  232. break;
  233. case 'ne':
  234. var a = this._plotDimensions.width - offsets.right;
  235. var b = offsets.top;
  236. this._elem.css({left:a, top:b});
  237. break;
  238. case 'e':
  239. var a = this._plotDimensions.width - offsets.right;
  240. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  241. this._elem.css({left:a, top:b});
  242. break;
  243. case 'se':
  244. var a = this._plotDimensions.width - offsets.right;
  245. var b = offsets.bottom;
  246. this._elem.css({left:a, bottom:b});
  247. break;
  248. case 's':
  249. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  250. var b = this._plotDimensions.height - offsets.bottom;
  251. this._elem.css({left:a, top:b});
  252. break;
  253. case 'sw':
  254. var a = this._plotDimensions.width - offsets.left;
  255. var b = offsets.bottom;
  256. this._elem.css({right:a, bottom:b});
  257. break;
  258. case 'w':
  259. var a = this._plotDimensions.width - offsets.left;
  260. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  261. this._elem.css({right:a, top:b});
  262. break;
  263. default: // same as 'se'
  264. var a = offsets.right;
  265. var b = offsets.bottom;
  266. this._elem.css({right:a, bottom:b});
  267. break;
  268. }
  269. }
  270. else {
  271. switch (this.location) {
  272. case 'nw':
  273. this._elem.css({left:0, top:offsets.top});
  274. break;
  275. case 'n':
  276. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  277. this._elem.css({left: a, top:offsets.top});
  278. break;
  279. case 'ne':
  280. this._elem.css({right:0, top:offsets.top});
  281. break;
  282. case 'e':
  283. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  284. this._elem.css({right:offsets.right, top:b});
  285. break;
  286. case 'se':
  287. this._elem.css({right:offsets.right, bottom:offsets.bottom});
  288. break;
  289. case 's':
  290. var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
  291. this._elem.css({left: a, bottom:offsets.bottom});
  292. break;
  293. case 'sw':
  294. this._elem.css({left:offsets.left, bottom:offsets.bottom});
  295. break;
  296. case 'w':
  297. var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
  298. this._elem.css({left:offsets.left, top:b});
  299. break;
  300. default: // same as 'se'
  301. this._elem.css({right:offsets.right, bottom:offsets.bottom});
  302. break;
  303. }
  304. }
  305. }
  306. };
  307. })(jQuery);