chart-tristate.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. /**
  2. * Tristate charts
  3. */
  4. $.fn.sparkline.tristate = tristate = createClass($.fn.sparkline._base, barHighlightMixin, {
  5. type: 'tristate',
  6. init: function (el, values, options, width, height) {
  7. var barWidth = parseInt(options.get('barWidth'), 10),
  8. barSpacing = parseInt(options.get('barSpacing'), 10);
  9. tristate._super.init.call(this, el, values, options, width, height);
  10. this.regionShapes = {};
  11. this.barWidth = barWidth;
  12. this.barSpacing = barSpacing;
  13. this.totalBarWidth = barWidth + barSpacing;
  14. this.values = $.map(values, Number);
  15. this.width = width = (values.length * barWidth) + ((values.length - 1) * barSpacing);
  16. if ($.isArray(options.get('colorMap'))) {
  17. this.colorMapByIndex = options.get('colorMap');
  18. this.colorMapByValue = null;
  19. } else {
  20. this.colorMapByIndex = null;
  21. this.colorMapByValue = options.get('colorMap');
  22. if (this.colorMapByValue && this.colorMapByValue.get === undefined) {
  23. this.colorMapByValue = new RangeMap(this.colorMapByValue);
  24. }
  25. }
  26. this.initTarget();
  27. },
  28. getRegion: function (el, x, y) {
  29. return Math.floor(x / this.totalBarWidth);
  30. },
  31. getCurrentRegionFields: function () {
  32. var currentRegion = this.currentRegion;
  33. return {
  34. isNull: this.values[currentRegion] === undefined,
  35. value: this.values[currentRegion],
  36. color: this.calcColor(this.values[currentRegion], currentRegion),
  37. offset: currentRegion
  38. };
  39. },
  40. calcColor: function (value, valuenum) {
  41. var values = this.values,
  42. options = this.options,
  43. colorMapByIndex = this.colorMapByIndex,
  44. colorMapByValue = this.colorMapByValue,
  45. color, newColor;
  46. if (colorMapByValue && (newColor = colorMapByValue.get(value))) {
  47. color = newColor;
  48. } else if (colorMapByIndex && colorMapByIndex.length > valuenum) {
  49. color = colorMapByIndex[valuenum];
  50. } else if (values[valuenum] < 0) {
  51. color = options.get('negBarColor');
  52. } else if (values[valuenum] > 0) {
  53. color = options.get('posBarColor');
  54. } else {
  55. color = options.get('zeroBarColor');
  56. }
  57. return color;
  58. },
  59. renderRegion: function (valuenum, highlight) {
  60. var values = this.values,
  61. options = this.options,
  62. target = this.target,
  63. canvasHeight, height, halfHeight,
  64. x, y, color;
  65. canvasHeight = target.pixelHeight;
  66. halfHeight = Math.round(canvasHeight / 2);
  67. x = valuenum * this.totalBarWidth;
  68. if (values[valuenum] < 0) {
  69. y = halfHeight;
  70. height = halfHeight - 1;
  71. } else if (values[valuenum] > 0) {
  72. y = 0;
  73. height = halfHeight - 1;
  74. } else {
  75. y = halfHeight - 1;
  76. height = 2;
  77. }
  78. color = this.calcColor(values[valuenum], valuenum);
  79. if (color === null) {
  80. return;
  81. }
  82. if (highlight) {
  83. color = this.calcHighlightColor(color, options);
  84. }
  85. return target.drawRect(x, y, this.barWidth - 1, height - 1, color, color);
  86. }
  87. });