GaugeView.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580
  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 PointerPath from './PointerPath.js';
  42. import * as graphic from '../../util/graphic.js';
  43. import { setStatesStylesFromModel, toggleHoverEmphasis } from '../../util/states.js';
  44. import { createTextStyle, setLabelValueAnimation, animateLabelValue } from '../../label/labelStyle.js';
  45. import ChartView from '../../view/Chart.js';
  46. import { parsePercent, round, linearMap } from '../../util/number.js';
  47. import Sausage from '../../util/shape/sausage.js';
  48. import { createSymbol } from '../../util/symbol.js';
  49. import ZRImage from 'zrender/lib/graphic/Image.js';
  50. import { extend, isFunction, isString } from 'zrender/lib/core/util.js';
  51. import { setCommonECData } from '../../util/innerStore.js';
  52. import { normalizeArcAngles } from 'zrender/lib/core/PathProxy.js';
  53. function parsePosition(seriesModel, api) {
  54. var center = seriesModel.get('center');
  55. var width = api.getWidth();
  56. var height = api.getHeight();
  57. var size = Math.min(width, height);
  58. var cx = parsePercent(center[0], api.getWidth());
  59. var cy = parsePercent(center[1], api.getHeight());
  60. var r = parsePercent(seriesModel.get('radius'), size / 2);
  61. return {
  62. cx: cx,
  63. cy: cy,
  64. r: r
  65. };
  66. }
  67. function formatLabel(value, labelFormatter) {
  68. var label = value == null ? '' : value + '';
  69. if (labelFormatter) {
  70. if (isString(labelFormatter)) {
  71. label = labelFormatter.replace('{value}', label);
  72. } else if (isFunction(labelFormatter)) {
  73. label = labelFormatter(value);
  74. }
  75. }
  76. return label;
  77. }
  78. var GaugeView =
  79. /** @class */
  80. function (_super) {
  81. __extends(GaugeView, _super);
  82. function GaugeView() {
  83. var _this = _super !== null && _super.apply(this, arguments) || this;
  84. _this.type = GaugeView.type;
  85. return _this;
  86. }
  87. GaugeView.prototype.render = function (seriesModel, ecModel, api) {
  88. this.group.removeAll();
  89. var colorList = seriesModel.get(['axisLine', 'lineStyle', 'color']);
  90. var posInfo = parsePosition(seriesModel, api);
  91. this._renderMain(seriesModel, ecModel, api, colorList, posInfo);
  92. this._data = seriesModel.getData();
  93. };
  94. GaugeView.prototype.dispose = function () {};
  95. GaugeView.prototype._renderMain = function (seriesModel, ecModel, api, colorList, posInfo) {
  96. var group = this.group;
  97. var clockwise = seriesModel.get('clockwise');
  98. var startAngle = -seriesModel.get('startAngle') / 180 * Math.PI;
  99. var endAngle = -seriesModel.get('endAngle') / 180 * Math.PI;
  100. var axisLineModel = seriesModel.getModel('axisLine');
  101. var roundCap = axisLineModel.get('roundCap');
  102. var MainPath = roundCap ? Sausage : graphic.Sector;
  103. var showAxis = axisLineModel.get('show');
  104. var lineStyleModel = axisLineModel.getModel('lineStyle');
  105. var axisLineWidth = lineStyleModel.get('width');
  106. var angles = [startAngle, endAngle];
  107. normalizeArcAngles(angles, !clockwise);
  108. startAngle = angles[0];
  109. endAngle = angles[1];
  110. var angleRangeSpan = endAngle - startAngle;
  111. var prevEndAngle = startAngle;
  112. for (var i = 0; showAxis && i < colorList.length; i++) {
  113. // Clamp
  114. var percent = Math.min(Math.max(colorList[i][0], 0), 1);
  115. endAngle = startAngle + angleRangeSpan * percent;
  116. var sector = new MainPath({
  117. shape: {
  118. startAngle: prevEndAngle,
  119. endAngle: endAngle,
  120. cx: posInfo.cx,
  121. cy: posInfo.cy,
  122. clockwise: clockwise,
  123. r0: posInfo.r - axisLineWidth,
  124. r: posInfo.r
  125. },
  126. silent: true
  127. });
  128. sector.setStyle({
  129. fill: colorList[i][1]
  130. });
  131. sector.setStyle(lineStyleModel.getLineStyle( // Because we use sector to simulate arc
  132. // so the properties for stroking are useless
  133. ['color', 'width']));
  134. group.add(sector);
  135. prevEndAngle = endAngle;
  136. }
  137. var getColor = function (percent) {
  138. // Less than 0
  139. if (percent <= 0) {
  140. return colorList[0][1];
  141. }
  142. var i;
  143. for (i = 0; i < colorList.length; i++) {
  144. if (colorList[i][0] >= percent && (i === 0 ? 0 : colorList[i - 1][0]) < percent) {
  145. return colorList[i][1];
  146. }
  147. } // More than 1
  148. return colorList[i - 1][1];
  149. };
  150. this._renderTicks(seriesModel, ecModel, api, getColor, posInfo, startAngle, endAngle, clockwise, axisLineWidth);
  151. this._renderTitleAndDetail(seriesModel, ecModel, api, getColor, posInfo);
  152. this._renderAnchor(seriesModel, posInfo);
  153. this._renderPointer(seriesModel, ecModel, api, getColor, posInfo, startAngle, endAngle, clockwise, axisLineWidth);
  154. };
  155. GaugeView.prototype._renderTicks = function (seriesModel, ecModel, api, getColor, posInfo, startAngle, endAngle, clockwise, axisLineWidth) {
  156. var group = this.group;
  157. var cx = posInfo.cx;
  158. var cy = posInfo.cy;
  159. var r = posInfo.r;
  160. var minVal = +seriesModel.get('min');
  161. var maxVal = +seriesModel.get('max');
  162. var splitLineModel = seriesModel.getModel('splitLine');
  163. var tickModel = seriesModel.getModel('axisTick');
  164. var labelModel = seriesModel.getModel('axisLabel');
  165. var splitNumber = seriesModel.get('splitNumber');
  166. var subSplitNumber = tickModel.get('splitNumber');
  167. var splitLineLen = parsePercent(splitLineModel.get('length'), r);
  168. var tickLen = parsePercent(tickModel.get('length'), r);
  169. var angle = startAngle;
  170. var step = (endAngle - startAngle) / splitNumber;
  171. var subStep = step / subSplitNumber;
  172. var splitLineStyle = splitLineModel.getModel('lineStyle').getLineStyle();
  173. var tickLineStyle = tickModel.getModel('lineStyle').getLineStyle();
  174. var splitLineDistance = splitLineModel.get('distance');
  175. var unitX;
  176. var unitY;
  177. for (var i = 0; i <= splitNumber; i++) {
  178. unitX = Math.cos(angle);
  179. unitY = Math.sin(angle); // Split line
  180. if (splitLineModel.get('show')) {
  181. var distance = splitLineDistance ? splitLineDistance + axisLineWidth : axisLineWidth;
  182. var splitLine = new graphic.Line({
  183. shape: {
  184. x1: unitX * (r - distance) + cx,
  185. y1: unitY * (r - distance) + cy,
  186. x2: unitX * (r - splitLineLen - distance) + cx,
  187. y2: unitY * (r - splitLineLen - distance) + cy
  188. },
  189. style: splitLineStyle,
  190. silent: true
  191. });
  192. if (splitLineStyle.stroke === 'auto') {
  193. splitLine.setStyle({
  194. stroke: getColor(i / splitNumber)
  195. });
  196. }
  197. group.add(splitLine);
  198. } // Label
  199. if (labelModel.get('show')) {
  200. var distance = labelModel.get('distance') + splitLineDistance;
  201. var label = formatLabel(round(i / splitNumber * (maxVal - minVal) + minVal), labelModel.get('formatter'));
  202. var autoColor = getColor(i / splitNumber);
  203. group.add(new graphic.Text({
  204. style: createTextStyle(labelModel, {
  205. text: label,
  206. x: unitX * (r - splitLineLen - distance) + cx,
  207. y: unitY * (r - splitLineLen - distance) + cy,
  208. verticalAlign: unitY < -0.8 ? 'top' : unitY > 0.8 ? 'bottom' : 'middle',
  209. align: unitX < -0.4 ? 'left' : unitX > 0.4 ? 'right' : 'center'
  210. }, {
  211. inheritColor: autoColor
  212. }),
  213. silent: true
  214. }));
  215. } // Axis tick
  216. if (tickModel.get('show') && i !== splitNumber) {
  217. var distance = tickModel.get('distance');
  218. distance = distance ? distance + axisLineWidth : axisLineWidth;
  219. for (var j = 0; j <= subSplitNumber; j++) {
  220. unitX = Math.cos(angle);
  221. unitY = Math.sin(angle);
  222. var tickLine = new graphic.Line({
  223. shape: {
  224. x1: unitX * (r - distance) + cx,
  225. y1: unitY * (r - distance) + cy,
  226. x2: unitX * (r - tickLen - distance) + cx,
  227. y2: unitY * (r - tickLen - distance) + cy
  228. },
  229. silent: true,
  230. style: tickLineStyle
  231. });
  232. if (tickLineStyle.stroke === 'auto') {
  233. tickLine.setStyle({
  234. stroke: getColor((i + j / subSplitNumber) / splitNumber)
  235. });
  236. }
  237. group.add(tickLine);
  238. angle += subStep;
  239. }
  240. angle -= subStep;
  241. } else {
  242. angle += step;
  243. }
  244. }
  245. };
  246. GaugeView.prototype._renderPointer = function (seriesModel, ecModel, api, getColor, posInfo, startAngle, endAngle, clockwise, axisLineWidth) {
  247. var group = this.group;
  248. var oldData = this._data;
  249. var oldProgressData = this._progressEls;
  250. var progressList = [];
  251. var showPointer = seriesModel.get(['pointer', 'show']);
  252. var progressModel = seriesModel.getModel('progress');
  253. var showProgress = progressModel.get('show');
  254. var data = seriesModel.getData();
  255. var valueDim = data.mapDimension('value');
  256. var minVal = +seriesModel.get('min');
  257. var maxVal = +seriesModel.get('max');
  258. var valueExtent = [minVal, maxVal];
  259. var angleExtent = [startAngle, endAngle];
  260. function createPointer(idx, angle) {
  261. var itemModel = data.getItemModel(idx);
  262. var pointerModel = itemModel.getModel('pointer');
  263. var pointerWidth = parsePercent(pointerModel.get('width'), posInfo.r);
  264. var pointerLength = parsePercent(pointerModel.get('length'), posInfo.r);
  265. var pointerStr = seriesModel.get(['pointer', 'icon']);
  266. var pointerOffset = pointerModel.get('offsetCenter');
  267. var pointerOffsetX = parsePercent(pointerOffset[0], posInfo.r);
  268. var pointerOffsetY = parsePercent(pointerOffset[1], posInfo.r);
  269. var pointerKeepAspect = pointerModel.get('keepAspect');
  270. var pointer; // not exist icon type will be set 'rect'
  271. if (pointerStr) {
  272. pointer = createSymbol(pointerStr, pointerOffsetX - pointerWidth / 2, pointerOffsetY - pointerLength, pointerWidth, pointerLength, null, pointerKeepAspect);
  273. } else {
  274. pointer = new PointerPath({
  275. shape: {
  276. angle: -Math.PI / 2,
  277. width: pointerWidth,
  278. r: pointerLength,
  279. x: pointerOffsetX,
  280. y: pointerOffsetY
  281. }
  282. });
  283. }
  284. pointer.rotation = -(angle + Math.PI / 2);
  285. pointer.x = posInfo.cx;
  286. pointer.y = posInfo.cy;
  287. return pointer;
  288. }
  289. function createProgress(idx, endAngle) {
  290. var roundCap = progressModel.get('roundCap');
  291. var ProgressPath = roundCap ? Sausage : graphic.Sector;
  292. var isOverlap = progressModel.get('overlap');
  293. var progressWidth = isOverlap ? progressModel.get('width') : axisLineWidth / data.count();
  294. var r0 = isOverlap ? posInfo.r - progressWidth : posInfo.r - (idx + 1) * progressWidth;
  295. var r = isOverlap ? posInfo.r : posInfo.r - idx * progressWidth;
  296. var progress = new ProgressPath({
  297. shape: {
  298. startAngle: startAngle,
  299. endAngle: endAngle,
  300. cx: posInfo.cx,
  301. cy: posInfo.cy,
  302. clockwise: clockwise,
  303. r0: r0,
  304. r: r
  305. }
  306. });
  307. isOverlap && (progress.z2 = maxVal - data.get(valueDim, idx) % maxVal);
  308. return progress;
  309. }
  310. if (showProgress || showPointer) {
  311. data.diff(oldData).add(function (idx) {
  312. var val = data.get(valueDim, idx);
  313. if (showPointer) {
  314. var pointer = createPointer(idx, startAngle); // TODO hide pointer on NaN value?
  315. graphic.initProps(pointer, {
  316. rotation: -((isNaN(+val) ? angleExtent[0] : linearMap(val, valueExtent, angleExtent, true)) + Math.PI / 2)
  317. }, seriesModel);
  318. group.add(pointer);
  319. data.setItemGraphicEl(idx, pointer);
  320. }
  321. if (showProgress) {
  322. var progress = createProgress(idx, startAngle);
  323. var isClip = progressModel.get('clip');
  324. graphic.initProps(progress, {
  325. shape: {
  326. endAngle: linearMap(val, valueExtent, angleExtent, isClip)
  327. }
  328. }, seriesModel);
  329. group.add(progress); // Add data index and series index for indexing the data by element
  330. // Useful in tooltip
  331. setCommonECData(seriesModel.seriesIndex, data.dataType, idx, progress);
  332. progressList[idx] = progress;
  333. }
  334. }).update(function (newIdx, oldIdx) {
  335. var val = data.get(valueDim, newIdx);
  336. if (showPointer) {
  337. var previousPointer = oldData.getItemGraphicEl(oldIdx);
  338. var previousRotate = previousPointer ? previousPointer.rotation : startAngle;
  339. var pointer = createPointer(newIdx, previousRotate);
  340. pointer.rotation = previousRotate;
  341. graphic.updateProps(pointer, {
  342. rotation: -((isNaN(+val) ? angleExtent[0] : linearMap(val, valueExtent, angleExtent, true)) + Math.PI / 2)
  343. }, seriesModel);
  344. group.add(pointer);
  345. data.setItemGraphicEl(newIdx, pointer);
  346. }
  347. if (showProgress) {
  348. var previousProgress = oldProgressData[oldIdx];
  349. var previousEndAngle = previousProgress ? previousProgress.shape.endAngle : startAngle;
  350. var progress = createProgress(newIdx, previousEndAngle);
  351. var isClip = progressModel.get('clip');
  352. graphic.updateProps(progress, {
  353. shape: {
  354. endAngle: linearMap(val, valueExtent, angleExtent, isClip)
  355. }
  356. }, seriesModel);
  357. group.add(progress); // Add data index and series index for indexing the data by element
  358. // Useful in tooltip
  359. setCommonECData(seriesModel.seriesIndex, data.dataType, newIdx, progress);
  360. progressList[newIdx] = progress;
  361. }
  362. }).execute();
  363. data.each(function (idx) {
  364. var itemModel = data.getItemModel(idx);
  365. var emphasisModel = itemModel.getModel('emphasis');
  366. var focus = emphasisModel.get('focus');
  367. var blurScope = emphasisModel.get('blurScope');
  368. var emphasisDisabled = emphasisModel.get('disabled');
  369. if (showPointer) {
  370. var pointer = data.getItemGraphicEl(idx);
  371. var symbolStyle = data.getItemVisual(idx, 'style');
  372. var visualColor = symbolStyle.fill;
  373. if (pointer instanceof ZRImage) {
  374. var pathStyle = pointer.style;
  375. pointer.useStyle(extend({
  376. image: pathStyle.image,
  377. x: pathStyle.x,
  378. y: pathStyle.y,
  379. width: pathStyle.width,
  380. height: pathStyle.height
  381. }, symbolStyle));
  382. } else {
  383. pointer.useStyle(symbolStyle);
  384. pointer.type !== 'pointer' && pointer.setColor(visualColor);
  385. }
  386. pointer.setStyle(itemModel.getModel(['pointer', 'itemStyle']).getItemStyle());
  387. if (pointer.style.fill === 'auto') {
  388. pointer.setStyle('fill', getColor(linearMap(data.get(valueDim, idx), valueExtent, [0, 1], true)));
  389. }
  390. pointer.z2EmphasisLift = 0;
  391. setStatesStylesFromModel(pointer, itemModel);
  392. toggleHoverEmphasis(pointer, focus, blurScope, emphasisDisabled);
  393. }
  394. if (showProgress) {
  395. var progress = progressList[idx];
  396. progress.useStyle(data.getItemVisual(idx, 'style'));
  397. progress.setStyle(itemModel.getModel(['progress', 'itemStyle']).getItemStyle());
  398. progress.z2EmphasisLift = 0;
  399. setStatesStylesFromModel(progress, itemModel);
  400. toggleHoverEmphasis(progress, focus, blurScope, emphasisDisabled);
  401. }
  402. });
  403. this._progressEls = progressList;
  404. }
  405. };
  406. GaugeView.prototype._renderAnchor = function (seriesModel, posInfo) {
  407. var anchorModel = seriesModel.getModel('anchor');
  408. var showAnchor = anchorModel.get('show');
  409. if (showAnchor) {
  410. var anchorSize = anchorModel.get('size');
  411. var anchorType = anchorModel.get('icon');
  412. var offsetCenter = anchorModel.get('offsetCenter');
  413. var anchorKeepAspect = anchorModel.get('keepAspect');
  414. var anchor = createSymbol(anchorType, posInfo.cx - anchorSize / 2 + parsePercent(offsetCenter[0], posInfo.r), posInfo.cy - anchorSize / 2 + parsePercent(offsetCenter[1], posInfo.r), anchorSize, anchorSize, null, anchorKeepAspect);
  415. anchor.z2 = anchorModel.get('showAbove') ? 1 : 0;
  416. anchor.setStyle(anchorModel.getModel('itemStyle').getItemStyle());
  417. this.group.add(anchor);
  418. }
  419. };
  420. GaugeView.prototype._renderTitleAndDetail = function (seriesModel, ecModel, api, getColor, posInfo) {
  421. var _this = this;
  422. var data = seriesModel.getData();
  423. var valueDim = data.mapDimension('value');
  424. var minVal = +seriesModel.get('min');
  425. var maxVal = +seriesModel.get('max');
  426. var contentGroup = new graphic.Group();
  427. var newTitleEls = [];
  428. var newDetailEls = [];
  429. var hasAnimation = seriesModel.isAnimationEnabled();
  430. var showPointerAbove = seriesModel.get(['pointer', 'showAbove']);
  431. data.diff(this._data).add(function (idx) {
  432. newTitleEls[idx] = new graphic.Text({
  433. silent: true
  434. });
  435. newDetailEls[idx] = new graphic.Text({
  436. silent: true
  437. });
  438. }).update(function (idx, oldIdx) {
  439. newTitleEls[idx] = _this._titleEls[oldIdx];
  440. newDetailEls[idx] = _this._detailEls[oldIdx];
  441. }).execute();
  442. data.each(function (idx) {
  443. var itemModel = data.getItemModel(idx);
  444. var value = data.get(valueDim, idx);
  445. var itemGroup = new graphic.Group();
  446. var autoColor = getColor(linearMap(value, [minVal, maxVal], [0, 1], true));
  447. var itemTitleModel = itemModel.getModel('title');
  448. if (itemTitleModel.get('show')) {
  449. var titleOffsetCenter = itemTitleModel.get('offsetCenter');
  450. var titleX = posInfo.cx + parsePercent(titleOffsetCenter[0], posInfo.r);
  451. var titleY = posInfo.cy + parsePercent(titleOffsetCenter[1], posInfo.r);
  452. var labelEl = newTitleEls[idx];
  453. labelEl.attr({
  454. z2: showPointerAbove ? 0 : 2,
  455. style: createTextStyle(itemTitleModel, {
  456. x: titleX,
  457. y: titleY,
  458. text: data.getName(idx),
  459. align: 'center',
  460. verticalAlign: 'middle'
  461. }, {
  462. inheritColor: autoColor
  463. })
  464. });
  465. itemGroup.add(labelEl);
  466. }
  467. var itemDetailModel = itemModel.getModel('detail');
  468. if (itemDetailModel.get('show')) {
  469. var detailOffsetCenter = itemDetailModel.get('offsetCenter');
  470. var detailX = posInfo.cx + parsePercent(detailOffsetCenter[0], posInfo.r);
  471. var detailY = posInfo.cy + parsePercent(detailOffsetCenter[1], posInfo.r);
  472. var width = parsePercent(itemDetailModel.get('width'), posInfo.r);
  473. var height = parsePercent(itemDetailModel.get('height'), posInfo.r);
  474. var detailColor = seriesModel.get(['progress', 'show']) ? data.getItemVisual(idx, 'style').fill : autoColor;
  475. var labelEl = newDetailEls[idx];
  476. var formatter_1 = itemDetailModel.get('formatter');
  477. labelEl.attr({
  478. z2: showPointerAbove ? 0 : 2,
  479. style: createTextStyle(itemDetailModel, {
  480. x: detailX,
  481. y: detailY,
  482. text: formatLabel(value, formatter_1),
  483. width: isNaN(width) ? null : width,
  484. height: isNaN(height) ? null : height,
  485. align: 'center',
  486. verticalAlign: 'middle'
  487. }, {
  488. inheritColor: detailColor
  489. })
  490. });
  491. setLabelValueAnimation(labelEl, {
  492. normal: itemDetailModel
  493. }, value, function (value) {
  494. return formatLabel(value, formatter_1);
  495. });
  496. hasAnimation && animateLabelValue(labelEl, idx, data, seriesModel, {
  497. getFormattedLabel: function (labelDataIndex, status, dataType, labelDimIndex, fmt, extendParams) {
  498. return formatLabel(extendParams ? extendParams.interpolatedValue : value, formatter_1);
  499. }
  500. });
  501. itemGroup.add(labelEl);
  502. }
  503. contentGroup.add(itemGroup);
  504. });
  505. this.group.add(contentGroup);
  506. this._titleEls = newTitleEls;
  507. this._detailEls = newDetailEls;
  508. };
  509. GaugeView.type = 'gauge';
  510. return GaugeView;
  511. }(ChartView);
  512. export default GaugeView;