RadarView.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  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 AxisBuilder from '../axis/AxisBuilder';
  43. import * as graphic from '../../util/graphic';
  44. import ComponentView from '../../view/Component';
  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 axisBuilder = new AxisBuilder(indicatorAxis.model, {
  66. position: [radar.cx, radar.cy],
  67. rotation: indicatorAxis.angle,
  68. labelDirection: -1,
  69. tickDirection: -1,
  70. nameDirection: 1
  71. });
  72. return axisBuilder;
  73. });
  74. zrUtil.each(axisBuilders, function (axisBuilder) {
  75. zrUtil.each(axisBuilderAttrs, axisBuilder.add, axisBuilder);
  76. this.group.add(axisBuilder.getGroup());
  77. }, this);
  78. };
  79. RadarView.prototype._buildSplitLineAndArea = function (radarModel) {
  80. var radar = radarModel.coordinateSystem;
  81. var indicatorAxes = radar.getIndicatorAxes();
  82. if (!indicatorAxes.length) {
  83. return;
  84. }
  85. var shape = radarModel.get('shape');
  86. var splitLineModel = radarModel.getModel('splitLine');
  87. var splitAreaModel = radarModel.getModel('splitArea');
  88. var lineStyleModel = splitLineModel.getModel('lineStyle');
  89. var areaStyleModel = splitAreaModel.getModel('areaStyle');
  90. var showSplitLine = splitLineModel.get('show');
  91. var showSplitArea = splitAreaModel.get('show');
  92. var splitLineColors = lineStyleModel.get('color');
  93. var splitAreaColors = areaStyleModel.get('color');
  94. var splitLineColorsArr = zrUtil.isArray(splitLineColors) ? splitLineColors : [splitLineColors];
  95. var splitAreaColorsArr = zrUtil.isArray(splitAreaColors) ? splitAreaColors : [splitAreaColors];
  96. var splitLines = [];
  97. var splitAreas = [];
  98. function getColorIndex(areaOrLine, areaOrLineColorList, idx) {
  99. var colorIndex = idx % areaOrLineColorList.length;
  100. areaOrLine[colorIndex] = areaOrLine[colorIndex] || [];
  101. return colorIndex;
  102. }
  103. if (shape === 'circle') {
  104. var ticksRadius = indicatorAxes[0].getTicksCoords();
  105. var cx = radar.cx;
  106. var cy = radar.cy;
  107. for (var i = 0; i < ticksRadius.length; i++) {
  108. if (showSplitLine) {
  109. var colorIndex = getColorIndex(splitLines, splitLineColorsArr, i);
  110. splitLines[colorIndex].push(new graphic.Circle({
  111. shape: {
  112. cx: cx,
  113. cy: cy,
  114. r: ticksRadius[i].coord
  115. }
  116. }));
  117. }
  118. if (showSplitArea && i < ticksRadius.length - 1) {
  119. var colorIndex = getColorIndex(splitAreas, splitAreaColorsArr, i);
  120. splitAreas[colorIndex].push(new graphic.Ring({
  121. shape: {
  122. cx: cx,
  123. cy: cy,
  124. r0: ticksRadius[i].coord,
  125. r: ticksRadius[i + 1].coord
  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. } // Close
  146. if (points[0]) {
  147. points.push(points[0].slice());
  148. } else {
  149. if (process.env.NODE_ENV !== 'production') {
  150. console.error('Can\'t draw value axis ' + i);
  151. }
  152. }
  153. if (showSplitLine) {
  154. var colorIndex = getColorIndex(splitLines, splitLineColorsArr, i);
  155. splitLines[colorIndex].push(new graphic.Polyline({
  156. shape: {
  157. points: points
  158. }
  159. }));
  160. }
  161. if (showSplitArea && prevPoints) {
  162. var colorIndex = getColorIndex(splitAreas, splitAreaColorsArr, i - 1);
  163. splitAreas[colorIndex].push(new graphic.Polygon({
  164. shape: {
  165. points: points.concat(prevPoints)
  166. }
  167. }));
  168. }
  169. prevPoints = points.slice().reverse();
  170. }
  171. }
  172. var lineStyle = lineStyleModel.getLineStyle();
  173. var areaStyle = areaStyleModel.getAreaStyle(); // Add splitArea before splitLine
  174. zrUtil.each(splitAreas, function (splitAreas, idx) {
  175. this.group.add(graphic.mergePath(splitAreas, {
  176. style: zrUtil.defaults({
  177. stroke: 'none',
  178. fill: splitAreaColorsArr[idx % splitAreaColorsArr.length]
  179. }, areaStyle),
  180. silent: true
  181. }));
  182. }, this);
  183. zrUtil.each(splitLines, function (splitLines, idx) {
  184. this.group.add(graphic.mergePath(splitLines, {
  185. style: zrUtil.defaults({
  186. fill: 'none',
  187. stroke: splitLineColorsArr[idx % splitLineColorsArr.length]
  188. }, lineStyle),
  189. silent: true
  190. }));
  191. }, this);
  192. };
  193. RadarView.type = 'radar';
  194. return RadarView;
  195. }(ComponentView);
  196. export default RadarView;