AxisBuilder.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636
  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 { retrieve, defaults, extend, each, isObject, map, isString, isNumber, isFunction } from 'zrender/lib/core/util.js';
  41. import * as graphic from '../../util/graphic.js';
  42. import { getECData } from '../../util/innerStore.js';
  43. import { createTextStyle } from '../../label/labelStyle.js';
  44. import Model from '../../model/Model.js';
  45. import { isRadianAroundZero, remRadian } from '../../util/number.js';
  46. import { createSymbol, normalizeSymbolOffset } from '../../util/symbol.js';
  47. import * as matrixUtil from 'zrender/lib/core/matrix.js';
  48. import { applyTransform as v2ApplyTransform } from 'zrender/lib/core/vector.js';
  49. import { shouldShowAllLabels } from '../../coord/axisHelper.js';
  50. import { prepareLayoutList, hideOverlap } from '../../label/labelLayoutHelper.js';
  51. var PI = Math.PI;
  52. /**
  53. * A final axis is translated and rotated from a "standard axis".
  54. * So opt.position and opt.rotation is required.
  55. *
  56. * A standard axis is and axis from [0, 0] to [0, axisExtent[1]],
  57. * for example: (0, 0) ------------> (0, 50)
  58. *
  59. * nameDirection or tickDirection or labelDirection is 1 means tick
  60. * or label is below the standard axis, whereas is -1 means above
  61. * the standard axis. labelOffset means offset between label and axis,
  62. * which is useful when 'onZero', where axisLabel is in the grid and
  63. * label in outside grid.
  64. *
  65. * Tips: like always,
  66. * positive rotation represents anticlockwise, and negative rotation
  67. * represents clockwise.
  68. * The direction of position coordinate is the same as the direction
  69. * of screen coordinate.
  70. *
  71. * Do not need to consider axis 'inverse', which is auto processed by
  72. * axis extent.
  73. */
  74. var AxisBuilder =
  75. /** @class */
  76. function () {
  77. function AxisBuilder(axisModel, opt) {
  78. this.group = new graphic.Group();
  79. this.opt = opt;
  80. this.axisModel = axisModel; // Default value
  81. defaults(opt, {
  82. labelOffset: 0,
  83. nameDirection: 1,
  84. tickDirection: 1,
  85. labelDirection: 1,
  86. silent: true,
  87. handleAutoShown: function () {
  88. return true;
  89. }
  90. }); // FIXME Not use a separate text group?
  91. var transformGroup = new graphic.Group({
  92. x: opt.position[0],
  93. y: opt.position[1],
  94. rotation: opt.rotation
  95. }); // this.group.add(transformGroup);
  96. // this._transformGroup = transformGroup;
  97. transformGroup.updateTransform();
  98. this._transformGroup = transformGroup;
  99. }
  100. AxisBuilder.prototype.hasBuilder = function (name) {
  101. return !!builders[name];
  102. };
  103. AxisBuilder.prototype.add = function (name) {
  104. builders[name](this.opt, this.axisModel, this.group, this._transformGroup);
  105. };
  106. AxisBuilder.prototype.getGroup = function () {
  107. return this.group;
  108. };
  109. AxisBuilder.innerTextLayout = function (axisRotation, textRotation, direction) {
  110. var rotationDiff = remRadian(textRotation - axisRotation);
  111. var textAlign;
  112. var textVerticalAlign;
  113. if (isRadianAroundZero(rotationDiff)) {
  114. // Label is parallel with axis line.
  115. textVerticalAlign = direction > 0 ? 'top' : 'bottom';
  116. textAlign = 'center';
  117. } else if (isRadianAroundZero(rotationDiff - PI)) {
  118. // Label is inverse parallel with axis line.
  119. textVerticalAlign = direction > 0 ? 'bottom' : 'top';
  120. textAlign = 'center';
  121. } else {
  122. textVerticalAlign = 'middle';
  123. if (rotationDiff > 0 && rotationDiff < PI) {
  124. textAlign = direction > 0 ? 'right' : 'left';
  125. } else {
  126. textAlign = direction > 0 ? 'left' : 'right';
  127. }
  128. }
  129. return {
  130. rotation: rotationDiff,
  131. textAlign: textAlign,
  132. textVerticalAlign: textVerticalAlign
  133. };
  134. };
  135. AxisBuilder.makeAxisEventDataBase = function (axisModel) {
  136. var eventData = {
  137. componentType: axisModel.mainType,
  138. componentIndex: axisModel.componentIndex
  139. };
  140. eventData[axisModel.mainType + 'Index'] = axisModel.componentIndex;
  141. return eventData;
  142. };
  143. AxisBuilder.isLabelSilent = function (axisModel) {
  144. var tooltipOpt = axisModel.get('tooltip');
  145. return axisModel.get('silent') // Consider mouse cursor, add these restrictions.
  146. || !(axisModel.get('triggerEvent') || tooltipOpt && tooltipOpt.show);
  147. };
  148. return AxisBuilder;
  149. }();
  150. ;
  151. var builders = {
  152. axisLine: function (opt, axisModel, group, transformGroup) {
  153. var shown = axisModel.get(['axisLine', 'show']);
  154. if (shown === 'auto' && opt.handleAutoShown) {
  155. shown = opt.handleAutoShown('axisLine');
  156. }
  157. if (!shown) {
  158. return;
  159. }
  160. var extent = axisModel.axis.getExtent();
  161. var matrix = transformGroup.transform;
  162. var pt1 = [extent[0], 0];
  163. var pt2 = [extent[1], 0];
  164. var inverse = pt1[0] > pt2[0];
  165. if (matrix) {
  166. v2ApplyTransform(pt1, pt1, matrix);
  167. v2ApplyTransform(pt2, pt2, matrix);
  168. }
  169. var lineStyle = extend({
  170. lineCap: 'round'
  171. }, axisModel.getModel(['axisLine', 'lineStyle']).getLineStyle());
  172. var line = new graphic.Line({
  173. shape: {
  174. x1: pt1[0],
  175. y1: pt1[1],
  176. x2: pt2[0],
  177. y2: pt2[1]
  178. },
  179. style: lineStyle,
  180. strokeContainThreshold: opt.strokeContainThreshold || 5,
  181. silent: true,
  182. z2: 1
  183. });
  184. graphic.subPixelOptimizeLine(line.shape, line.style.lineWidth);
  185. line.anid = 'line';
  186. group.add(line);
  187. var arrows = axisModel.get(['axisLine', 'symbol']);
  188. if (arrows != null) {
  189. var arrowSize = axisModel.get(['axisLine', 'symbolSize']);
  190. if (isString(arrows)) {
  191. // Use the same arrow for start and end point
  192. arrows = [arrows, arrows];
  193. }
  194. if (isString(arrowSize) || isNumber(arrowSize)) {
  195. // Use the same size for width and height
  196. arrowSize = [arrowSize, arrowSize];
  197. }
  198. var arrowOffset = normalizeSymbolOffset(axisModel.get(['axisLine', 'symbolOffset']) || 0, arrowSize);
  199. var symbolWidth_1 = arrowSize[0];
  200. var symbolHeight_1 = arrowSize[1];
  201. each([{
  202. rotate: opt.rotation + Math.PI / 2,
  203. offset: arrowOffset[0],
  204. r: 0
  205. }, {
  206. rotate: opt.rotation - Math.PI / 2,
  207. offset: arrowOffset[1],
  208. r: Math.sqrt((pt1[0] - pt2[0]) * (pt1[0] - pt2[0]) + (pt1[1] - pt2[1]) * (pt1[1] - pt2[1]))
  209. }], function (point, index) {
  210. if (arrows[index] !== 'none' && arrows[index] != null) {
  211. var symbol = createSymbol(arrows[index], -symbolWidth_1 / 2, -symbolHeight_1 / 2, symbolWidth_1, symbolHeight_1, lineStyle.stroke, true); // Calculate arrow position with offset
  212. var r = point.r + point.offset;
  213. var pt = inverse ? pt2 : pt1;
  214. symbol.attr({
  215. rotation: point.rotate,
  216. x: pt[0] + r * Math.cos(opt.rotation),
  217. y: pt[1] - r * Math.sin(opt.rotation),
  218. silent: true,
  219. z2: 11
  220. });
  221. group.add(symbol);
  222. }
  223. });
  224. }
  225. },
  226. axisTickLabel: function (opt, axisModel, group, transformGroup) {
  227. var ticksEls = buildAxisMajorTicks(group, transformGroup, axisModel, opt);
  228. var labelEls = buildAxisLabel(group, transformGroup, axisModel, opt);
  229. fixMinMaxLabelShow(axisModel, labelEls, ticksEls);
  230. buildAxisMinorTicks(group, transformGroup, axisModel, opt.tickDirection); // This bit fixes the label overlap issue for the time chart.
  231. // See https://github.com/apache/echarts/issues/14266 for more.
  232. if (axisModel.get(['axisLabel', 'hideOverlap'])) {
  233. var labelList = prepareLayoutList(map(labelEls, function (label) {
  234. return {
  235. label: label,
  236. priority: label.z2,
  237. defaultAttr: {
  238. ignore: label.ignore
  239. }
  240. };
  241. }));
  242. hideOverlap(labelList);
  243. }
  244. },
  245. axisName: function (opt, axisModel, group, transformGroup) {
  246. var name = retrieve(opt.axisName, axisModel.get('name'));
  247. if (!name) {
  248. return;
  249. }
  250. var nameLocation = axisModel.get('nameLocation');
  251. var nameDirection = opt.nameDirection;
  252. var textStyleModel = axisModel.getModel('nameTextStyle');
  253. var gap = axisModel.get('nameGap') || 0;
  254. var extent = axisModel.axis.getExtent();
  255. var gapSignal = extent[0] > extent[1] ? -1 : 1;
  256. var pos = [nameLocation === 'start' ? extent[0] - gapSignal * gap : nameLocation === 'end' ? extent[1] + gapSignal * gap : (extent[0] + extent[1]) / 2, // Reuse labelOffset.
  257. isNameLocationCenter(nameLocation) ? opt.labelOffset + nameDirection * gap : 0];
  258. var labelLayout;
  259. var nameRotation = axisModel.get('nameRotate');
  260. if (nameRotation != null) {
  261. nameRotation = nameRotation * PI / 180; // To radian.
  262. }
  263. var axisNameAvailableWidth;
  264. if (isNameLocationCenter(nameLocation)) {
  265. labelLayout = AxisBuilder.innerTextLayout(opt.rotation, nameRotation != null ? nameRotation : opt.rotation, // Adapt to axis.
  266. nameDirection);
  267. } else {
  268. labelLayout = endTextLayout(opt.rotation, nameLocation, nameRotation || 0, extent);
  269. axisNameAvailableWidth = opt.axisNameAvailableWidth;
  270. if (axisNameAvailableWidth != null) {
  271. axisNameAvailableWidth = Math.abs(axisNameAvailableWidth / Math.sin(labelLayout.rotation));
  272. !isFinite(axisNameAvailableWidth) && (axisNameAvailableWidth = null);
  273. }
  274. }
  275. var textFont = textStyleModel.getFont();
  276. var truncateOpt = axisModel.get('nameTruncate', true) || {};
  277. var ellipsis = truncateOpt.ellipsis;
  278. var maxWidth = retrieve(opt.nameTruncateMaxWidth, truncateOpt.maxWidth, axisNameAvailableWidth);
  279. var textEl = new graphic.Text({
  280. x: pos[0],
  281. y: pos[1],
  282. rotation: labelLayout.rotation,
  283. silent: AxisBuilder.isLabelSilent(axisModel),
  284. style: createTextStyle(textStyleModel, {
  285. text: name,
  286. font: textFont,
  287. overflow: 'truncate',
  288. width: maxWidth,
  289. ellipsis: ellipsis,
  290. fill: textStyleModel.getTextColor() || axisModel.get(['axisLine', 'lineStyle', 'color']),
  291. align: textStyleModel.get('align') || labelLayout.textAlign,
  292. verticalAlign: textStyleModel.get('verticalAlign') || labelLayout.textVerticalAlign
  293. }),
  294. z2: 1
  295. });
  296. graphic.setTooltipConfig({
  297. el: textEl,
  298. componentModel: axisModel,
  299. itemName: name
  300. });
  301. textEl.__fullText = name; // Id for animation
  302. textEl.anid = 'name';
  303. if (axisModel.get('triggerEvent')) {
  304. var eventData = AxisBuilder.makeAxisEventDataBase(axisModel);
  305. eventData.targetType = 'axisName';
  306. eventData.name = name;
  307. getECData(textEl).eventData = eventData;
  308. } // FIXME
  309. transformGroup.add(textEl);
  310. textEl.updateTransform();
  311. group.add(textEl);
  312. textEl.decomposeTransform();
  313. }
  314. };
  315. function endTextLayout(rotation, textPosition, textRotate, extent) {
  316. var rotationDiff = remRadian(textRotate - rotation);
  317. var textAlign;
  318. var textVerticalAlign;
  319. var inverse = extent[0] > extent[1];
  320. var onLeft = textPosition === 'start' && !inverse || textPosition !== 'start' && inverse;
  321. if (isRadianAroundZero(rotationDiff - PI / 2)) {
  322. textVerticalAlign = onLeft ? 'bottom' : 'top';
  323. textAlign = 'center';
  324. } else if (isRadianAroundZero(rotationDiff - PI * 1.5)) {
  325. textVerticalAlign = onLeft ? 'top' : 'bottom';
  326. textAlign = 'center';
  327. } else {
  328. textVerticalAlign = 'middle';
  329. if (rotationDiff < PI * 1.5 && rotationDiff > PI / 2) {
  330. textAlign = onLeft ? 'left' : 'right';
  331. } else {
  332. textAlign = onLeft ? 'right' : 'left';
  333. }
  334. }
  335. return {
  336. rotation: rotationDiff,
  337. textAlign: textAlign,
  338. textVerticalAlign: textVerticalAlign
  339. };
  340. }
  341. function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
  342. if (shouldShowAllLabels(axisModel.axis)) {
  343. return;
  344. } // If min or max are user set, we need to check
  345. // If the tick on min(max) are overlap on their neighbour tick
  346. // If they are overlapped, we need to hide the min(max) tick label
  347. var showMinLabel = axisModel.get(['axisLabel', 'showMinLabel']);
  348. var showMaxLabel = axisModel.get(['axisLabel', 'showMaxLabel']); // FIXME
  349. // Have not consider onBand yet, where tick els is more than label els.
  350. labelEls = labelEls || [];
  351. tickEls = tickEls || [];
  352. var firstLabel = labelEls[0];
  353. var nextLabel = labelEls[1];
  354. var lastLabel = labelEls[labelEls.length - 1];
  355. var prevLabel = labelEls[labelEls.length - 2];
  356. var firstTick = tickEls[0];
  357. var nextTick = tickEls[1];
  358. var lastTick = tickEls[tickEls.length - 1];
  359. var prevTick = tickEls[tickEls.length - 2];
  360. if (showMinLabel === false) {
  361. ignoreEl(firstLabel);
  362. ignoreEl(firstTick);
  363. } else if (isTwoLabelOverlapped(firstLabel, nextLabel)) {
  364. if (showMinLabel) {
  365. ignoreEl(nextLabel);
  366. ignoreEl(nextTick);
  367. } else {
  368. ignoreEl(firstLabel);
  369. ignoreEl(firstTick);
  370. }
  371. }
  372. if (showMaxLabel === false) {
  373. ignoreEl(lastLabel);
  374. ignoreEl(lastTick);
  375. } else if (isTwoLabelOverlapped(prevLabel, lastLabel)) {
  376. if (showMaxLabel) {
  377. ignoreEl(prevLabel);
  378. ignoreEl(prevTick);
  379. } else {
  380. ignoreEl(lastLabel);
  381. ignoreEl(lastTick);
  382. }
  383. }
  384. }
  385. function ignoreEl(el) {
  386. el && (el.ignore = true);
  387. }
  388. function isTwoLabelOverlapped(current, next) {
  389. // current and next has the same rotation.
  390. var firstRect = current && current.getBoundingRect().clone();
  391. var nextRect = next && next.getBoundingRect().clone();
  392. if (!firstRect || !nextRect) {
  393. return;
  394. } // When checking intersect of two rotated labels, we use mRotationBack
  395. // to avoid that boundingRect is enlarge when using `boundingRect.applyTransform`.
  396. var mRotationBack = matrixUtil.identity([]);
  397. matrixUtil.rotate(mRotationBack, mRotationBack, -current.rotation);
  398. firstRect.applyTransform(matrixUtil.mul([], mRotationBack, current.getLocalTransform()));
  399. nextRect.applyTransform(matrixUtil.mul([], mRotationBack, next.getLocalTransform()));
  400. return firstRect.intersect(nextRect);
  401. }
  402. function isNameLocationCenter(nameLocation) {
  403. return nameLocation === 'middle' || nameLocation === 'center';
  404. }
  405. function createTicks(ticksCoords, tickTransform, tickEndCoord, tickLineStyle, anidPrefix) {
  406. var tickEls = [];
  407. var pt1 = [];
  408. var pt2 = [];
  409. for (var i = 0; i < ticksCoords.length; i++) {
  410. var tickCoord = ticksCoords[i].coord;
  411. pt1[0] = tickCoord;
  412. pt1[1] = 0;
  413. pt2[0] = tickCoord;
  414. pt2[1] = tickEndCoord;
  415. if (tickTransform) {
  416. v2ApplyTransform(pt1, pt1, tickTransform);
  417. v2ApplyTransform(pt2, pt2, tickTransform);
  418. } // Tick line, Not use group transform to have better line draw
  419. var tickEl = new graphic.Line({
  420. shape: {
  421. x1: pt1[0],
  422. y1: pt1[1],
  423. x2: pt2[0],
  424. y2: pt2[1]
  425. },
  426. style: tickLineStyle,
  427. z2: 2,
  428. autoBatch: true,
  429. silent: true
  430. });
  431. graphic.subPixelOptimizeLine(tickEl.shape, tickEl.style.lineWidth);
  432. tickEl.anid = anidPrefix + '_' + ticksCoords[i].tickValue;
  433. tickEls.push(tickEl);
  434. }
  435. return tickEls;
  436. }
  437. function buildAxisMajorTicks(group, transformGroup, axisModel, opt) {
  438. var axis = axisModel.axis;
  439. var tickModel = axisModel.getModel('axisTick');
  440. var shown = tickModel.get('show');
  441. if (shown === 'auto' && opt.handleAutoShown) {
  442. shown = opt.handleAutoShown('axisTick');
  443. }
  444. if (!shown || axis.scale.isBlank()) {
  445. return;
  446. }
  447. var lineStyleModel = tickModel.getModel('lineStyle');
  448. var tickEndCoord = opt.tickDirection * tickModel.get('length');
  449. var ticksCoords = axis.getTicksCoords();
  450. var ticksEls = createTicks(ticksCoords, transformGroup.transform, tickEndCoord, defaults(lineStyleModel.getLineStyle(), {
  451. stroke: axisModel.get(['axisLine', 'lineStyle', 'color'])
  452. }), 'ticks');
  453. for (var i = 0; i < ticksEls.length; i++) {
  454. group.add(ticksEls[i]);
  455. }
  456. return ticksEls;
  457. }
  458. function buildAxisMinorTicks(group, transformGroup, axisModel, tickDirection) {
  459. var axis = axisModel.axis;
  460. var minorTickModel = axisModel.getModel('minorTick');
  461. if (!minorTickModel.get('show') || axis.scale.isBlank()) {
  462. return;
  463. }
  464. var minorTicksCoords = axis.getMinorTicksCoords();
  465. if (!minorTicksCoords.length) {
  466. return;
  467. }
  468. var lineStyleModel = minorTickModel.getModel('lineStyle');
  469. var tickEndCoord = tickDirection * minorTickModel.get('length');
  470. var minorTickLineStyle = defaults(lineStyleModel.getLineStyle(), defaults(axisModel.getModel('axisTick').getLineStyle(), {
  471. stroke: axisModel.get(['axisLine', 'lineStyle', 'color'])
  472. }));
  473. for (var i = 0; i < minorTicksCoords.length; i++) {
  474. var minorTicksEls = createTicks(minorTicksCoords[i], transformGroup.transform, tickEndCoord, minorTickLineStyle, 'minorticks_' + i);
  475. for (var k = 0; k < minorTicksEls.length; k++) {
  476. group.add(minorTicksEls[k]);
  477. }
  478. }
  479. }
  480. function buildAxisLabel(group, transformGroup, axisModel, opt) {
  481. var axis = axisModel.axis;
  482. var show = retrieve(opt.axisLabelShow, axisModel.get(['axisLabel', 'show']));
  483. if (!show || axis.scale.isBlank()) {
  484. return;
  485. }
  486. var labelModel = axisModel.getModel('axisLabel');
  487. var labelMargin = labelModel.get('margin');
  488. var labels = axis.getViewLabels(); // Special label rotate.
  489. var labelRotation = (retrieve(opt.labelRotate, labelModel.get('rotate')) || 0) * PI / 180;
  490. var labelLayout = AxisBuilder.innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
  491. var rawCategoryData = axisModel.getCategories && axisModel.getCategories(true);
  492. var labelEls = [];
  493. var silent = AxisBuilder.isLabelSilent(axisModel);
  494. var triggerEvent = axisModel.get('triggerEvent');
  495. each(labels, function (labelItem, index) {
  496. var tickValue = axis.scale.type === 'ordinal' ? axis.scale.getRawOrdinalNumber(labelItem.tickValue) : labelItem.tickValue;
  497. var formattedLabel = labelItem.formattedLabel;
  498. var rawLabel = labelItem.rawLabel;
  499. var itemLabelModel = labelModel;
  500. if (rawCategoryData && rawCategoryData[tickValue]) {
  501. var rawCategoryItem = rawCategoryData[tickValue];
  502. if (isObject(rawCategoryItem) && rawCategoryItem.textStyle) {
  503. itemLabelModel = new Model(rawCategoryItem.textStyle, labelModel, axisModel.ecModel);
  504. }
  505. }
  506. var textColor = itemLabelModel.getTextColor() || axisModel.get(['axisLine', 'lineStyle', 'color']);
  507. var tickCoord = axis.dataToCoord(tickValue);
  508. var textEl = new graphic.Text({
  509. x: tickCoord,
  510. y: opt.labelOffset + opt.labelDirection * labelMargin,
  511. rotation: labelLayout.rotation,
  512. silent: silent,
  513. z2: 10 + (labelItem.level || 0),
  514. style: createTextStyle(itemLabelModel, {
  515. text: formattedLabel,
  516. align: itemLabelModel.getShallow('align', true) || labelLayout.textAlign,
  517. verticalAlign: itemLabelModel.getShallow('verticalAlign', true) || itemLabelModel.getShallow('baseline', true) || labelLayout.textVerticalAlign,
  518. fill: isFunction(textColor) ? textColor( // (1) In category axis with data zoom, tick is not the original
  519. // index of axis.data. So tick should not be exposed to user
  520. // in category axis.
  521. // (2) Compatible with previous version, which always use formatted label as
  522. // input. But in interval scale the formatted label is like '223,445', which
  523. // maked user replace ','. So we modify it to return original val but remain
  524. // it as 'string' to avoid error in replacing.
  525. axis.type === 'category' ? rawLabel : axis.type === 'value' ? tickValue + '' : tickValue, index) : textColor
  526. })
  527. });
  528. textEl.anid = 'label_' + tickValue; // Pack data for mouse event
  529. if (triggerEvent) {
  530. var eventData = AxisBuilder.makeAxisEventDataBase(axisModel);
  531. eventData.targetType = 'axisLabel';
  532. eventData.value = rawLabel;
  533. eventData.tickIndex = index;
  534. if (axis.type === 'category') {
  535. eventData.dataIndex = tickValue;
  536. }
  537. getECData(textEl).eventData = eventData;
  538. } // FIXME
  539. transformGroup.add(textEl);
  540. textEl.updateTransform();
  541. labelEls.push(textEl);
  542. group.add(textEl);
  543. textEl.decomposeTransform();
  544. });
  545. return labelEls;
  546. }
  547. export default AxisBuilder;