RadarView.js 7.6 KB

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