PiecewiseView.js 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing,
  13. * software distributed under the License is distributed on an
  14. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15. * KIND, either express or implied. See the License for the
  16. * specific language governing permissions and limitations
  17. * under the License.
  18. */
  19. /**
  20. * AUTO-GENERATED FILE. DO NOT MODIFY.
  21. */
  22. /*
  23. * Licensed to the Apache Software Foundation (ASF) under one
  24. * or more contributor license agreements. See the NOTICE file
  25. * distributed with this work for additional information
  26. * regarding copyright ownership. The ASF licenses this file
  27. * to you under the Apache License, Version 2.0 (the
  28. * "License"); you may not use this file except in compliance
  29. * with the License. You may obtain a copy of the License at
  30. *
  31. * http://www.apache.org/licenses/LICENSE-2.0
  32. *
  33. * Unless required by applicable law or agreed to in writing,
  34. * software distributed under the License is distributed on an
  35. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  36. * KIND, either express or implied. See the License for the
  37. * specific language governing permissions and limitations
  38. * under the License.
  39. */
  40. import { __extends } from "tslib";
  41. import * as zrUtil from 'zrender/lib/core/util';
  42. import VisualMapView from './VisualMapView';
  43. import * as graphic from '../../util/graphic';
  44. import { createSymbol } from '../../util/symbol';
  45. import * as layout from '../../util/layout';
  46. import * as helper from './helper';
  47. var PiecewiseVisualMapView =
  48. /** @class */
  49. function (_super) {
  50. __extends(PiecewiseVisualMapView, _super);
  51. function PiecewiseVisualMapView() {
  52. var _this = _super !== null && _super.apply(this, arguments) || this;
  53. _this.type = PiecewiseVisualMapView.type;
  54. return _this;
  55. }
  56. PiecewiseVisualMapView.prototype.doRender = function () {
  57. var thisGroup = this.group;
  58. thisGroup.removeAll();
  59. var visualMapModel = this.visualMapModel;
  60. var textGap = visualMapModel.get('textGap');
  61. var textStyleModel = visualMapModel.textStyleModel;
  62. var textFont = textStyleModel.getFont();
  63. var textFill = textStyleModel.getTextColor();
  64. var itemAlign = this._getItemAlign();
  65. var itemSize = visualMapModel.itemSize;
  66. var viewData = this._getViewData();
  67. var endsText = viewData.endsText;
  68. var showLabel = zrUtil.retrieve(visualMapModel.get('showLabel', true), !endsText);
  69. endsText && this._renderEndsText(thisGroup, endsText[0], itemSize, showLabel, itemAlign);
  70. zrUtil.each(viewData.viewPieceList, function (item) {
  71. var piece = item.piece;
  72. var itemGroup = new graphic.Group();
  73. itemGroup.onclick = zrUtil.bind(this._onItemClick, this, piece);
  74. this._enableHoverLink(itemGroup, item.indexInModelPieceList); // TODO Category
  75. var representValue = visualMapModel.getRepresentValue(piece);
  76. this._createItemSymbol(itemGroup, representValue, [0, 0, itemSize[0], itemSize[1]]);
  77. if (showLabel) {
  78. var visualState = this.visualMapModel.getValueState(representValue);
  79. itemGroup.add(new graphic.Text({
  80. style: {
  81. x: itemAlign === 'right' ? -textGap : itemSize[0] + textGap,
  82. y: itemSize[1] / 2,
  83. text: piece.text,
  84. verticalAlign: 'middle',
  85. align: itemAlign,
  86. font: textFont,
  87. fill: textFill,
  88. opacity: visualState === 'outOfRange' ? 0.5 : 1
  89. }
  90. }));
  91. }
  92. thisGroup.add(itemGroup);
  93. }, this);
  94. endsText && this._renderEndsText(thisGroup, endsText[1], itemSize, showLabel, itemAlign);
  95. layout.box(visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap'));
  96. this.renderBackground(thisGroup);
  97. this.positionGroup(thisGroup);
  98. };
  99. PiecewiseVisualMapView.prototype._enableHoverLink = function (itemGroup, pieceIndex) {
  100. var _this = this;
  101. itemGroup.on('mouseover', function () {
  102. return onHoverLink('highlight');
  103. }).on('mouseout', function () {
  104. return onHoverLink('downplay');
  105. });
  106. var onHoverLink = function (method) {
  107. var visualMapModel = _this.visualMapModel; // TODO: TYPE More detailed action types
  108. visualMapModel.option.hoverLink && _this.api.dispatchAction({
  109. type: method,
  110. batch: helper.makeHighDownBatch(visualMapModel.findTargetDataIndices(pieceIndex), visualMapModel)
  111. });
  112. };
  113. };
  114. PiecewiseVisualMapView.prototype._getItemAlign = function () {
  115. var visualMapModel = this.visualMapModel;
  116. var modelOption = visualMapModel.option;
  117. if (modelOption.orient === 'vertical') {
  118. return helper.getItemAlign(visualMapModel, this.api, visualMapModel.itemSize);
  119. } else {
  120. // horizontal, most case left unless specifying right.
  121. var align = modelOption.align;
  122. if (!align || align === 'auto') {
  123. align = 'left';
  124. }
  125. return align;
  126. }
  127. };
  128. PiecewiseVisualMapView.prototype._renderEndsText = function (group, text, itemSize, showLabel, itemAlign) {
  129. if (!text) {
  130. return;
  131. }
  132. var itemGroup = new graphic.Group();
  133. var textStyleModel = this.visualMapModel.textStyleModel;
  134. itemGroup.add(new graphic.Text({
  135. style: {
  136. x: showLabel ? itemAlign === 'right' ? itemSize[0] : 0 : itemSize[0] / 2,
  137. y: itemSize[1] / 2,
  138. verticalAlign: 'middle',
  139. align: showLabel ? itemAlign : 'center',
  140. text: text,
  141. font: textStyleModel.getFont(),
  142. fill: textStyleModel.getTextColor()
  143. }
  144. }));
  145. group.add(itemGroup);
  146. };
  147. /**
  148. * @private
  149. * @return {Object} {peiceList, endsText} The order is the same as screen pixel order.
  150. */
  151. PiecewiseVisualMapView.prototype._getViewData = function () {
  152. var visualMapModel = this.visualMapModel;
  153. var viewPieceList = zrUtil.map(visualMapModel.getPieceList(), function (piece, index) {
  154. return {
  155. piece: piece,
  156. indexInModelPieceList: index
  157. };
  158. });
  159. var endsText = visualMapModel.get('text'); // Consider orient and inverse.
  160. var orient = visualMapModel.get('orient');
  161. var inverse = visualMapModel.get('inverse'); // Order of model pieceList is always [low, ..., high]
  162. if (orient === 'horizontal' ? inverse : !inverse) {
  163. viewPieceList.reverse();
  164. } // Origin order of endsText is [high, low]
  165. else if (endsText) {
  166. endsText = endsText.slice().reverse();
  167. }
  168. return {
  169. viewPieceList: viewPieceList,
  170. endsText: endsText
  171. };
  172. };
  173. PiecewiseVisualMapView.prototype._createItemSymbol = function (group, representValue, shapeParam) {
  174. group.add(createSymbol( // symbol will be string
  175. this.getControllerVisual(representValue, 'symbol'), shapeParam[0], shapeParam[1], shapeParam[2], shapeParam[3], // color will be string
  176. this.getControllerVisual(representValue, 'color')));
  177. };
  178. PiecewiseVisualMapView.prototype._onItemClick = function (piece) {
  179. var visualMapModel = this.visualMapModel;
  180. var option = visualMapModel.option;
  181. var selected = zrUtil.clone(option.selected);
  182. var newKey = visualMapModel.getSelectedMapKey(piece);
  183. if (option.selectedMode === 'single') {
  184. selected[newKey] = true;
  185. zrUtil.each(selected, function (o, key) {
  186. selected[key] = key === newKey;
  187. });
  188. } else {
  189. selected[newKey] = !selected[newKey];
  190. }
  191. this.api.dispatchAction({
  192. type: 'selectDataRange',
  193. from: this.uid,
  194. visualMapId: this.visualMapModel.id,
  195. selected: selected
  196. });
  197. };
  198. PiecewiseVisualMapView.type = 'visualMap.piecewise';
  199. return PiecewiseVisualMapView;
  200. }(VisualMapView);
  201. export default PiecewiseVisualMapView;