RadarView.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  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.js';
  42. import AxisBuilder from '../axis/AxisBuilder.js';
  43. import * as graphic from '../../util/graphic.js';
  44. import ComponentView from '../../view/Component.js';
  45. var RadarView = /** @class */function (_super) {
  46. __extends(RadarView, _super);
  47. function RadarView() {
  48. var _this = _super !== null && _super.apply(this, arguments) || this;
  49. _this.type = RadarView.type;
  50. return _this;
  51. }
  52. RadarView.prototype.render = function (radarModel, ecModel, api) {
  53. var group = this.group;
  54. group.removeAll();
  55. this._buildAxes(radarModel, api);
  56. this._buildSplitLineAndArea(radarModel);
  57. };
  58. RadarView.prototype._buildAxes = function (radarModel, api) {
  59. var radar = radarModel.coordinateSystem;
  60. var indicatorAxes = radar.getIndicatorAxes();
  61. var axisBuilders = zrUtil.map(indicatorAxes, function (indicatorAxis) {
  62. var axisName = indicatorAxis.model.get('showName') ? indicatorAxis.name : ''; // hide name
  63. var axisBuilder = new AxisBuilder(indicatorAxis.model, api, {
  64. axisName: axisName,
  65. position: [radar.cx, radar.cy],
  66. rotation: indicatorAxis.angle,
  67. labelDirection: -1,
  68. tickDirection: -1,
  69. nameDirection: 1
  70. });
  71. return axisBuilder;
  72. });
  73. zrUtil.each(axisBuilders, function (axisBuilder) {
  74. axisBuilder.build();
  75. this.group.add(axisBuilder.group);
  76. }, this);
  77. };
  78. RadarView.prototype._buildSplitLineAndArea = function (radarModel) {
  79. var radar = radarModel.coordinateSystem;
  80. var indicatorAxes = radar.getIndicatorAxes();
  81. if (!indicatorAxes.length) {
  82. return;
  83. }
  84. var shape = radarModel.get('shape');
  85. var splitLineModel = radarModel.getModel('splitLine');
  86. var splitAreaModel = radarModel.getModel('splitArea');
  87. var lineStyleModel = splitLineModel.getModel('lineStyle');
  88. var areaStyleModel = splitAreaModel.getModel('areaStyle');
  89. var showSplitLine = splitLineModel.get('show');
  90. var showSplitArea = splitAreaModel.get('show');
  91. var splitLineColors = lineStyleModel.get('color');
  92. var splitAreaColors = areaStyleModel.get('color');
  93. var splitLineColorsArr = zrUtil.isArray(splitLineColors) ? splitLineColors : [splitLineColors];
  94. var splitAreaColorsArr = zrUtil.isArray(splitAreaColors) ? splitAreaColors : [splitAreaColors];
  95. var splitLines = [];
  96. var splitAreas = [];
  97. function getColorIndex(areaOrLine, areaOrLineColorList, idx) {
  98. var colorIndex = idx % areaOrLineColorList.length;
  99. areaOrLine[colorIndex] = areaOrLine[colorIndex] || [];
  100. return colorIndex;
  101. }
  102. if (shape === 'circle') {
  103. var ticksRadius = indicatorAxes[0].getTicksCoords();
  104. var cx = radar.cx;
  105. var cy = radar.cy;
  106. for (var i = 0; i < ticksRadius.length; i++) {
  107. if (showSplitLine) {
  108. var colorIndex = getColorIndex(splitLines, splitLineColorsArr, i);
  109. splitLines[colorIndex].push(new graphic.Circle({
  110. shape: {
  111. cx: cx,
  112. cy: cy,
  113. r: ticksRadius[i].coord
  114. }
  115. }));
  116. }
  117. if (showSplitArea && i < ticksRadius.length - 1) {
  118. var colorIndex = getColorIndex(splitAreas, splitAreaColorsArr, i);
  119. splitAreas[colorIndex].push(new graphic.Ring({
  120. shape: {
  121. cx: cx,
  122. cy: cy,
  123. r0: ticksRadius[i].coord,
  124. r: ticksRadius[i + 1].coord
  125. }
  126. }));
  127. }
  128. }
  129. }
  130. // Polyyon
  131. else {
  132. var realSplitNumber_1;
  133. var axesTicksPoints = zrUtil.map(indicatorAxes, function (indicatorAxis, idx) {
  134. var ticksCoords = indicatorAxis.getTicksCoords();
  135. realSplitNumber_1 = realSplitNumber_1 == null ? ticksCoords.length - 1 : Math.min(ticksCoords.length - 1, realSplitNumber_1);
  136. return zrUtil.map(ticksCoords, function (tickCoord) {
  137. return radar.coordToPoint(tickCoord.coord, idx);
  138. });
  139. });
  140. var prevPoints = [];
  141. for (var i = 0; i <= realSplitNumber_1; i++) {
  142. var points = [];
  143. for (var j = 0; j < indicatorAxes.length; j++) {
  144. points.push(axesTicksPoints[j][i]);
  145. }
  146. // Close
  147. if (points[0]) {
  148. points.push(points[0].slice());
  149. } else {
  150. if (process.env.NODE_ENV !== 'production') {
  151. console.error('Can\'t draw value axis ' + i);
  152. }
  153. }
  154. if (showSplitLine) {
  155. var colorIndex = getColorIndex(splitLines, splitLineColorsArr, i);
  156. splitLines[colorIndex].push(new graphic.Polyline({
  157. shape: {
  158. points: points
  159. }
  160. }));
  161. }
  162. if (showSplitArea && prevPoints) {
  163. var colorIndex = getColorIndex(splitAreas, splitAreaColorsArr, i - 1);
  164. splitAreas[colorIndex].push(new graphic.Polygon({
  165. shape: {
  166. points: points.concat(prevPoints)
  167. }
  168. }));
  169. }
  170. prevPoints = points.slice().reverse();
  171. }
  172. }
  173. var lineStyle = lineStyleModel.getLineStyle();
  174. var areaStyle = areaStyleModel.getAreaStyle();
  175. // Add splitArea before splitLine
  176. zrUtil.each(splitAreas, function (splitAreas, idx) {
  177. this.group.add(graphic.mergePath(splitAreas, {
  178. style: zrUtil.defaults({
  179. stroke: 'none',
  180. fill: splitAreaColorsArr[idx % splitAreaColorsArr.length]
  181. }, areaStyle),
  182. silent: true
  183. }));
  184. }, this);
  185. zrUtil.each(splitLines, function (splitLines, idx) {
  186. this.group.add(graphic.mergePath(splitLines, {
  187. style: zrUtil.defaults({
  188. fill: 'none',
  189. stroke: splitLineColorsArr[idx % splitLineColorsArr.length]
  190. }, lineStyle),
  191. silent: true
  192. }));
  193. }, this);
  194. };
  195. RadarView.type = 'radar';
  196. return RadarView;
  197. }(ComponentView);
  198. export default RadarView;