ContinuousModel.js 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  1. var zrUtil = require("zrender/lib/core/util");
  2. var VisualMapModel = require("./VisualMapModel");
  3. var numberUtil = require("../../util/number");
  4. // Constant
  5. var DEFAULT_BAR_BOUND = [20, 140];
  6. var ContinuousModel = VisualMapModel.extend({
  7. type: 'visualMap.continuous',
  8. /**
  9. * @protected
  10. */
  11. defaultOption: {
  12. align: 'auto',
  13. // 'auto', 'left', 'right', 'top', 'bottom'
  14. calculable: false,
  15. // This prop effect default component type determine,
  16. // See echarts/component/visualMap/typeDefaulter.
  17. range: null,
  18. // selected range. In default case `range` is [min, max]
  19. // and can auto change along with modification of min max,
  20. // util use specifid a range.
  21. realtime: true,
  22. // Whether realtime update.
  23. itemHeight: null,
  24. // The length of the range control edge.
  25. itemWidth: null,
  26. // The length of the other side.
  27. hoverLink: true,
  28. // Enable hover highlight.
  29. hoverLinkDataSize: null,
  30. // The size of hovered data.
  31. hoverLinkOnHandle: null // Whether trigger hoverLink when hover handle.
  32. // If not specified, follow the value of `realtime`.
  33. },
  34. /**
  35. * @override
  36. */
  37. optionUpdated: function (newOption, isInit) {
  38. ContinuousModel.superApply(this, 'optionUpdated', arguments);
  39. this.resetExtent();
  40. this.resetVisual(function (mappingOption) {
  41. mappingOption.mappingMethod = 'linear';
  42. mappingOption.dataExtent = this.getExtent();
  43. });
  44. this._resetRange();
  45. },
  46. /**
  47. * @protected
  48. * @override
  49. */
  50. resetItemSize: function () {
  51. ContinuousModel.superApply(this, 'resetItemSize', arguments);
  52. var itemSize = this.itemSize;
  53. this._orient === 'horizontal' && itemSize.reverse();
  54. (itemSize[0] == null || isNaN(itemSize[0])) && (itemSize[0] = DEFAULT_BAR_BOUND[0]);
  55. (itemSize[1] == null || isNaN(itemSize[1])) && (itemSize[1] = DEFAULT_BAR_BOUND[1]);
  56. },
  57. /**
  58. * @private
  59. */
  60. _resetRange: function () {
  61. var dataExtent = this.getExtent();
  62. var range = this.option.range;
  63. if (!range || range.auto) {
  64. // `range` should always be array (so we dont use other
  65. // value like 'auto') for user-friend. (consider getOption).
  66. dataExtent.auto = 1;
  67. this.option.range = dataExtent;
  68. } else if (zrUtil.isArray(range)) {
  69. if (range[0] > range[1]) {
  70. range.reverse();
  71. }
  72. range[0] = Math.max(range[0], dataExtent[0]);
  73. range[1] = Math.min(range[1], dataExtent[1]);
  74. }
  75. },
  76. /**
  77. * @protected
  78. * @override
  79. */
  80. completeVisualOption: function () {
  81. VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
  82. zrUtil.each(this.stateList, function (state) {
  83. var symbolSize = this.option.controller[state].symbolSize;
  84. if (symbolSize && symbolSize[0] !== symbolSize[1]) {
  85. symbolSize[0] = 0; // For good looking.
  86. }
  87. }, this);
  88. },
  89. /**
  90. * @override
  91. */
  92. setSelected: function (selected) {
  93. this.option.range = selected.slice();
  94. this._resetRange();
  95. },
  96. /**
  97. * @public
  98. */
  99. getSelected: function () {
  100. var dataExtent = this.getExtent();
  101. var dataInterval = numberUtil.asc((this.get('range') || []).slice()); // Clamp
  102. dataInterval[0] > dataExtent[1] && (dataInterval[0] = dataExtent[1]);
  103. dataInterval[1] > dataExtent[1] && (dataInterval[1] = dataExtent[1]);
  104. dataInterval[0] < dataExtent[0] && (dataInterval[0] = dataExtent[0]);
  105. dataInterval[1] < dataExtent[0] && (dataInterval[1] = dataExtent[0]);
  106. return dataInterval;
  107. },
  108. /**
  109. * @override
  110. */
  111. getValueState: function (value) {
  112. var range = this.option.range;
  113. var dataExtent = this.getExtent(); // When range[0] === dataExtent[0], any value larger than dataExtent[0] maps to 'inRange'.
  114. // range[1] is processed likewise.
  115. return (range[0] <= dataExtent[0] || range[0] <= value) && (range[1] >= dataExtent[1] || value <= range[1]) ? 'inRange' : 'outOfRange';
  116. },
  117. /**
  118. * @params {Array.<number>} range target value: range[0] <= value && value <= range[1]
  119. * @return {Array.<Object>} [{seriesId, dataIndices: <Array.<number>>}, ...]
  120. */
  121. findTargetDataIndices: function (range) {
  122. var result = [];
  123. this.eachTargetSeries(function (seriesModel) {
  124. var dataIndices = [];
  125. var data = seriesModel.getData();
  126. data.each(this.getDataDimension(data), function (value, dataIndex) {
  127. range[0] <= value && value <= range[1] && dataIndices.push(dataIndex);
  128. }, true, this);
  129. result.push({
  130. seriesId: seriesModel.id,
  131. dataIndex: dataIndices
  132. });
  133. }, this);
  134. return result;
  135. },
  136. /**
  137. * @implement
  138. */
  139. getVisualMeta: function (getColorVisual) {
  140. var oVals = getColorStopValues(this, 'outOfRange', this.getExtent());
  141. var iVals = getColorStopValues(this, 'inRange', this.option.range.slice());
  142. var stops = [];
  143. function setStop(value, valueState) {
  144. stops.push({
  145. value: value,
  146. color: getColorVisual(value, valueState)
  147. });
  148. } // Format to: outOfRange -- inRange -- outOfRange.
  149. var iIdx = 0;
  150. var oIdx = 0;
  151. var iLen = iVals.length;
  152. var oLen = oVals.length;
  153. for (; oIdx < oLen && (!iVals.length || oVals[oIdx] <= iVals[0]); oIdx++) {
  154. // If oVal[oIdx] === iVals[iIdx], oVal[oIdx] should be ignored.
  155. if (oVals[oIdx] < iVals[iIdx]) {
  156. setStop(oVals[oIdx], 'outOfRange');
  157. }
  158. }
  159. for (var first = 1; iIdx < iLen; iIdx++, first = 0) {
  160. // If range is full, value beyond min, max will be clamped.
  161. // make a singularity
  162. first && stops.length && setStop(iVals[iIdx], 'outOfRange');
  163. setStop(iVals[iIdx], 'inRange');
  164. }
  165. for (var first = 1; oIdx < oLen; oIdx++) {
  166. if (!iVals.length || iVals[iVals.length - 1] < oVals[oIdx]) {
  167. // make a singularity
  168. if (first) {
  169. stops.length && setStop(stops[stops.length - 1].value, 'outOfRange');
  170. first = 0;
  171. }
  172. setStop(oVals[oIdx], 'outOfRange');
  173. }
  174. }
  175. var stopsLen = stops.length;
  176. return {
  177. stops: stops,
  178. outerColors: [stopsLen ? stops[0].color : 'transparent', stopsLen ? stops[stopsLen - 1].color : 'transparent']
  179. };
  180. }
  181. });
  182. function getColorStopValues(visualMapModel, valueState, dataExtent) {
  183. if (dataExtent[0] === dataExtent[1]) {
  184. return dataExtent.slice();
  185. } // When using colorHue mapping, it is not linear color any more.
  186. // Moreover, canvas gradient seems not to be accurate linear.
  187. // FIXME
  188. // Should be arbitrary value 100? or based on pixel size?
  189. var count = 200;
  190. var step = (dataExtent[1] - dataExtent[0]) / count;
  191. var value = dataExtent[0];
  192. var stopValues = [];
  193. for (var i = 0; i <= count && value < dataExtent[1]; i++) {
  194. stopValues.push(value);
  195. value += step;
  196. }
  197. stopValues.push(dataExtent[1]);
  198. return stopValues;
  199. }
  200. var _default = ContinuousModel;
  201. module.exports = _default;