AxisBuilder.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635
  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 seperate 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. if (matrix) {
  165. v2ApplyTransform(pt1, pt1, matrix);
  166. v2ApplyTransform(pt2, pt2, matrix);
  167. }
  168. var lineStyle = extend({
  169. lineCap: 'round'
  170. }, axisModel.getModel(['axisLine', 'lineStyle']).getLineStyle());
  171. var line = new graphic.Line({
  172. // Id for animation
  173. subPixelOptimize: true,
  174. shape: {
  175. x1: pt1[0],
  176. y1: pt1[1],
  177. x2: pt2[0],
  178. y2: pt2[1]
  179. },
  180. style: lineStyle,
  181. strokeContainThreshold: opt.strokeContainThreshold || 5,
  182. silent: true,
  183. z2: 1
  184. });
  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. symbol.attr({
  214. rotation: point.rotate,
  215. x: pt1[0] + r * Math.cos(opt.rotation),
  216. y: pt1[1] - r * Math.sin(opt.rotation),
  217. silent: true,
  218. z2: 11
  219. });
  220. group.add(symbol);
  221. }
  222. });
  223. }
  224. },
  225. axisTickLabel: function (opt, axisModel, group, transformGroup) {
  226. var ticksEls = buildAxisMajorTicks(group, transformGroup, axisModel, opt);
  227. var labelEls = buildAxisLabel(group, transformGroup, axisModel, opt);
  228. fixMinMaxLabelShow(axisModel, labelEls, ticksEls);
  229. buildAxisMinorTicks(group, transformGroup, axisModel, opt.tickDirection); // This bit fixes the label overlap issue for the time chart.
  230. // See https://github.com/apache/echarts/issues/14266 for more.
  231. if (axisModel.get(['axisLabel', 'hideOverlap'])) {
  232. var labelList = prepareLayoutList(map(labelEls, function (label) {
  233. return {
  234. label: label,
  235. priority: label.z2,
  236. defaultAttr: {
  237. ignore: label.ignore
  238. }
  239. };
  240. }));
  241. hideOverlap(labelList);
  242. }
  243. },
  244. axisName: function (opt, axisModel, group, transformGroup) {
  245. var name = retrieve(opt.axisName, axisModel.get('name'));
  246. if (!name) {
  247. return;
  248. }
  249. var nameLocation = axisModel.get('nameLocation');
  250. var nameDirection = opt.nameDirection;
  251. var textStyleModel = axisModel.getModel('nameTextStyle');
  252. var gap = axisModel.get('nameGap') || 0;
  253. var extent = axisModel.axis.getExtent();
  254. var gapSignal = extent[0] > extent[1] ? -1 : 1;
  255. var pos = [nameLocation === 'start' ? extent[0] - gapSignal * gap : nameLocation === 'end' ? extent[1] + gapSignal * gap : (extent[0] + extent[1]) / 2, // Reuse labelOffset.
  256. isNameLocationCenter(nameLocation) ? opt.labelOffset + nameDirection * gap : 0];
  257. var labelLayout;
  258. var nameRotation = axisModel.get('nameRotate');
  259. if (nameRotation != null) {
  260. nameRotation = nameRotation * PI / 180; // To radian.
  261. }
  262. var axisNameAvailableWidth;
  263. if (isNameLocationCenter(nameLocation)) {
  264. labelLayout = AxisBuilder.innerTextLayout(opt.rotation, nameRotation != null ? nameRotation : opt.rotation, // Adapt to axis.
  265. nameDirection);
  266. } else {
  267. labelLayout = endTextLayout(opt.rotation, nameLocation, nameRotation || 0, extent);
  268. axisNameAvailableWidth = opt.axisNameAvailableWidth;
  269. if (axisNameAvailableWidth != null) {
  270. axisNameAvailableWidth = Math.abs(axisNameAvailableWidth / Math.sin(labelLayout.rotation));
  271. !isFinite(axisNameAvailableWidth) && (axisNameAvailableWidth = null);
  272. }
  273. }
  274. var textFont = textStyleModel.getFont();
  275. var truncateOpt = axisModel.get('nameTruncate', true) || {};
  276. var ellipsis = truncateOpt.ellipsis;
  277. var maxWidth = retrieve(opt.nameTruncateMaxWidth, truncateOpt.maxWidth, axisNameAvailableWidth);
  278. var textEl = new graphic.Text({
  279. x: pos[0],
  280. y: pos[1],
  281. rotation: labelLayout.rotation,
  282. silent: AxisBuilder.isLabelSilent(axisModel),
  283. style: createTextStyle(textStyleModel, {
  284. text: name,
  285. font: textFont,
  286. overflow: 'truncate',
  287. width: maxWidth,
  288. ellipsis: ellipsis,
  289. fill: textStyleModel.getTextColor() || axisModel.get(['axisLine', 'lineStyle', 'color']),
  290. align: textStyleModel.get('align') || labelLayout.textAlign,
  291. verticalAlign: textStyleModel.get('verticalAlign') || labelLayout.textVerticalAlign
  292. }),
  293. z2: 1
  294. });
  295. graphic.setTooltipConfig({
  296. el: textEl,
  297. componentModel: axisModel,
  298. itemName: name
  299. });
  300. textEl.__fullText = name; // Id for animation
  301. textEl.anid = 'name';
  302. if (axisModel.get('triggerEvent')) {
  303. var eventData = AxisBuilder.makeAxisEventDataBase(axisModel);
  304. eventData.targetType = 'axisName';
  305. eventData.name = name;
  306. getECData(textEl).eventData = eventData;
  307. } // FIXME
  308. transformGroup.add(textEl);
  309. textEl.updateTransform();
  310. group.add(textEl);
  311. textEl.decomposeTransform();
  312. }
  313. };
  314. function endTextLayout(rotation, textPosition, textRotate, extent) {
  315. var rotationDiff = remRadian(textRotate - rotation);
  316. var textAlign;
  317. var textVerticalAlign;
  318. var inverse = extent[0] > extent[1];
  319. var onLeft = textPosition === 'start' && !inverse || textPosition !== 'start' && inverse;
  320. if (isRadianAroundZero(rotationDiff - PI / 2)) {
  321. textVerticalAlign = onLeft ? 'bottom' : 'top';
  322. textAlign = 'center';
  323. } else if (isRadianAroundZero(rotationDiff - PI * 1.5)) {
  324. textVerticalAlign = onLeft ? 'top' : 'bottom';
  325. textAlign = 'center';
  326. } else {
  327. textVerticalAlign = 'middle';
  328. if (rotationDiff < PI * 1.5 && rotationDiff > PI / 2) {
  329. textAlign = onLeft ? 'left' : 'right';
  330. } else {
  331. textAlign = onLeft ? 'right' : 'left';
  332. }
  333. }
  334. return {
  335. rotation: rotationDiff,
  336. textAlign: textAlign,
  337. textVerticalAlign: textVerticalAlign
  338. };
  339. }
  340. function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
  341. if (shouldShowAllLabels(axisModel.axis)) {
  342. return;
  343. } // If min or max are user set, we need to check
  344. // If the tick on min(max) are overlap on their neighbour tick
  345. // If they are overlapped, we need to hide the min(max) tick label
  346. var showMinLabel = axisModel.get(['axisLabel', 'showMinLabel']);
  347. var showMaxLabel = axisModel.get(['axisLabel', 'showMaxLabel']); // FIXME
  348. // Have not consider onBand yet, where tick els is more than label els.
  349. labelEls = labelEls || [];
  350. tickEls = tickEls || [];
  351. var firstLabel = labelEls[0];
  352. var nextLabel = labelEls[1];
  353. var lastLabel = labelEls[labelEls.length - 1];
  354. var prevLabel = labelEls[labelEls.length - 2];
  355. var firstTick = tickEls[0];
  356. var nextTick = tickEls[1];
  357. var lastTick = tickEls[tickEls.length - 1];
  358. var prevTick = tickEls[tickEls.length - 2];
  359. if (showMinLabel === false) {
  360. ignoreEl(firstLabel);
  361. ignoreEl(firstTick);
  362. } else if (isTwoLabelOverlapped(firstLabel, nextLabel)) {
  363. if (showMinLabel) {
  364. ignoreEl(nextLabel);
  365. ignoreEl(nextTick);
  366. } else {
  367. ignoreEl(firstLabel);
  368. ignoreEl(firstTick);
  369. }
  370. }
  371. if (showMaxLabel === false) {
  372. ignoreEl(lastLabel);
  373. ignoreEl(lastTick);
  374. } else if (isTwoLabelOverlapped(prevLabel, lastLabel)) {
  375. if (showMaxLabel) {
  376. ignoreEl(prevLabel);
  377. ignoreEl(prevTick);
  378. } else {
  379. ignoreEl(lastLabel);
  380. ignoreEl(lastTick);
  381. }
  382. }
  383. }
  384. function ignoreEl(el) {
  385. el && (el.ignore = true);
  386. }
  387. function isTwoLabelOverlapped(current, next) {
  388. // current and next has the same rotation.
  389. var firstRect = current && current.getBoundingRect().clone();
  390. var nextRect = next && next.getBoundingRect().clone();
  391. if (!firstRect || !nextRect) {
  392. return;
  393. } // When checking intersect of two rotated labels, we use mRotationBack
  394. // to avoid that boundingRect is enlarge when using `boundingRect.applyTransform`.
  395. var mRotationBack = matrixUtil.identity([]);
  396. matrixUtil.rotate(mRotationBack, mRotationBack, -current.rotation);
  397. firstRect.applyTransform(matrixUtil.mul([], mRotationBack, current.getLocalTransform()));
  398. nextRect.applyTransform(matrixUtil.mul([], mRotationBack, next.getLocalTransform()));
  399. return firstRect.intersect(nextRect);
  400. }
  401. function isNameLocationCenter(nameLocation) {
  402. return nameLocation === 'middle' || nameLocation === 'center';
  403. }
  404. function createTicks(ticksCoords, tickTransform, tickEndCoord, tickLineStyle, anidPrefix) {
  405. var tickEls = [];
  406. var pt1 = [];
  407. var pt2 = [];
  408. for (var i = 0; i < ticksCoords.length; i++) {
  409. var tickCoord = ticksCoords[i].coord;
  410. pt1[0] = tickCoord;
  411. pt1[1] = 0;
  412. pt2[0] = tickCoord;
  413. pt2[1] = tickEndCoord;
  414. if (tickTransform) {
  415. v2ApplyTransform(pt1, pt1, tickTransform);
  416. v2ApplyTransform(pt2, pt2, tickTransform);
  417. } // Tick line, Not use group transform to have better line draw
  418. var tickEl = new graphic.Line({
  419. subPixelOptimize: true,
  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. tickEl.anid = anidPrefix + '_' + ticksCoords[i].tickValue;
  432. tickEls.push(tickEl);
  433. }
  434. return tickEls;
  435. }
  436. function buildAxisMajorTicks(group, transformGroup, axisModel, opt) {
  437. var axis = axisModel.axis;
  438. var tickModel = axisModel.getModel('axisTick');
  439. var shown = tickModel.get('show');
  440. if (shown === 'auto' && opt.handleAutoShown) {
  441. shown = opt.handleAutoShown('axisTick');
  442. }
  443. if (!shown || axis.scale.isBlank()) {
  444. return;
  445. }
  446. var lineStyleModel = tickModel.getModel('lineStyle');
  447. var tickEndCoord = opt.tickDirection * tickModel.get('length');
  448. var ticksCoords = axis.getTicksCoords();
  449. var ticksEls = createTicks(ticksCoords, transformGroup.transform, tickEndCoord, defaults(lineStyleModel.getLineStyle(), {
  450. stroke: axisModel.get(['axisLine', 'lineStyle', 'color'])
  451. }), 'ticks');
  452. for (var i = 0; i < ticksEls.length; i++) {
  453. group.add(ticksEls[i]);
  454. }
  455. return ticksEls;
  456. }
  457. function buildAxisMinorTicks(group, transformGroup, axisModel, tickDirection) {
  458. var axis = axisModel.axis;
  459. var minorTickModel = axisModel.getModel('minorTick');
  460. if (!minorTickModel.get('show') || axis.scale.isBlank()) {
  461. return;
  462. }
  463. var minorTicksCoords = axis.getMinorTicksCoords();
  464. if (!minorTicksCoords.length) {
  465. return;
  466. }
  467. var lineStyleModel = minorTickModel.getModel('lineStyle');
  468. var tickEndCoord = tickDirection * minorTickModel.get('length');
  469. var minorTickLineStyle = defaults(lineStyleModel.getLineStyle(), defaults(axisModel.getModel('axisTick').getLineStyle(), {
  470. stroke: axisModel.get(['axisLine', 'lineStyle', 'color'])
  471. }));
  472. for (var i = 0; i < minorTicksCoords.length; i++) {
  473. var minorTicksEls = createTicks(minorTicksCoords[i], transformGroup.transform, tickEndCoord, minorTickLineStyle, 'minorticks_' + i);
  474. for (var k = 0; k < minorTicksEls.length; k++) {
  475. group.add(minorTicksEls[k]);
  476. }
  477. }
  478. }
  479. function buildAxisLabel(group, transformGroup, axisModel, opt) {
  480. var axis = axisModel.axis;
  481. var show = retrieve(opt.axisLabelShow, axisModel.get(['axisLabel', 'show']));
  482. if (!show || axis.scale.isBlank()) {
  483. return;
  484. }
  485. var labelModel = axisModel.getModel('axisLabel');
  486. var labelMargin = labelModel.get('margin');
  487. var labels = axis.getViewLabels(); // Special label rotate.
  488. var labelRotation = (retrieve(opt.labelRotate, labelModel.get('rotate')) || 0) * PI / 180;
  489. var labelLayout = AxisBuilder.innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
  490. var rawCategoryData = axisModel.getCategories && axisModel.getCategories(true);
  491. var labelEls = [];
  492. var silent = AxisBuilder.isLabelSilent(axisModel);
  493. var triggerEvent = axisModel.get('triggerEvent');
  494. each(labels, function (labelItem, index) {
  495. var tickValue = axis.scale.type === 'ordinal' ? axis.scale.getRawOrdinalNumber(labelItem.tickValue) : labelItem.tickValue;
  496. var formattedLabel = labelItem.formattedLabel;
  497. var rawLabel = labelItem.rawLabel;
  498. var itemLabelModel = labelModel;
  499. if (rawCategoryData && rawCategoryData[tickValue]) {
  500. var rawCategoryItem = rawCategoryData[tickValue];
  501. if (isObject(rawCategoryItem) && rawCategoryItem.textStyle) {
  502. itemLabelModel = new Model(rawCategoryItem.textStyle, labelModel, axisModel.ecModel);
  503. }
  504. }
  505. var textColor = itemLabelModel.getTextColor() || axisModel.get(['axisLine', 'lineStyle', 'color']);
  506. var tickCoord = axis.dataToCoord(tickValue);
  507. var textEl = new graphic.Text({
  508. x: tickCoord,
  509. y: opt.labelOffset + opt.labelDirection * labelMargin,
  510. rotation: labelLayout.rotation,
  511. silent: silent,
  512. z2: 10 + (labelItem.level || 0),
  513. style: createTextStyle(itemLabelModel, {
  514. text: formattedLabel,
  515. align: itemLabelModel.getShallow('align', true) || labelLayout.textAlign,
  516. verticalAlign: itemLabelModel.getShallow('verticalAlign', true) || itemLabelModel.getShallow('baseline', true) || labelLayout.textVerticalAlign,
  517. fill: isFunction(textColor) ? textColor( // (1) In category axis with data zoom, tick is not the original
  518. // index of axis.data. So tick should not be exposed to user
  519. // in category axis.
  520. // (2) Compatible with previous version, which always use formatted label as
  521. // input. But in interval scale the formatted label is like '223,445', which
  522. // maked user repalce ','. So we modify it to return original val but remain
  523. // it as 'string' to avoid error in replacing.
  524. axis.type === 'category' ? rawLabel : axis.type === 'value' ? tickValue + '' : tickValue, index) : textColor
  525. })
  526. });
  527. textEl.anid = 'label_' + tickValue; // Pack data for mouse event
  528. if (triggerEvent) {
  529. var eventData = AxisBuilder.makeAxisEventDataBase(axisModel);
  530. eventData.targetType = 'axisLabel';
  531. eventData.value = rawLabel;
  532. eventData.tickIndex = index;
  533. if (axis.type === 'category') {
  534. eventData.dataIndex = tickValue;
  535. }
  536. getECData(textEl).eventData = eventData;
  537. } // FIXME
  538. transformGroup.add(textEl);
  539. textEl.updateTransform();
  540. labelEls.push(textEl);
  541. group.add(textEl);
  542. textEl.decomposeTransform();
  543. });
  544. return labelEls;
  545. }
  546. export default AxisBuilder;