Grid.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493
  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. /**
  41. * Grid is a region which contains at most 4 cartesian systems
  42. *
  43. * TODO Default cartesian
  44. */
  45. import { isObject, each, indexOf, retrieve3, keys } from 'zrender/lib/core/util.js';
  46. import { getLayoutRect } from '../../util/layout.js';
  47. import { createScaleByModel, ifAxisCrossZero, niceScaleExtent, estimateLabelUnionRect, getDataDimensionsOnAxis } from '../../coord/axisHelper.js';
  48. import Cartesian2D, { cartesian2DDimensions } from './Cartesian2D.js';
  49. import Axis2D from './Axis2D.js';
  50. import { SINGLE_REFERRING } from '../../util/model.js';
  51. import { isCartesian2DSeries, findAxisModels } from './cartesianAxisHelper.js';
  52. import { isIntervalOrLogScale } from '../../scale/helper.js';
  53. import { alignScaleTicks } from '../axisAlignTicks.js';
  54. var Grid = /** @class */function () {
  55. function Grid(gridModel, ecModel, api) {
  56. // FIXME:TS where used (different from registered type 'cartesian2d')?
  57. this.type = 'grid';
  58. this._coordsMap = {};
  59. this._coordsList = [];
  60. this._axesMap = {};
  61. this._axesList = [];
  62. this.axisPointerEnabled = true;
  63. this.dimensions = cartesian2DDimensions;
  64. this._initCartesian(gridModel, ecModel, api);
  65. this.model = gridModel;
  66. }
  67. Grid.prototype.getRect = function () {
  68. return this._rect;
  69. };
  70. Grid.prototype.update = function (ecModel, api) {
  71. var axesMap = this._axesMap;
  72. this._updateScale(ecModel, this.model);
  73. function updateAxisTicks(axes) {
  74. var alignTo;
  75. // Axis is added in order of axisIndex.
  76. var axesIndices = keys(axes);
  77. var len = axesIndices.length;
  78. if (!len) {
  79. return;
  80. }
  81. var axisNeedsAlign = [];
  82. // Process once and calculate the ticks for those don't use alignTicks.
  83. for (var i = len - 1; i >= 0; i--) {
  84. var idx = +axesIndices[i]; // Convert to number.
  85. var axis = axes[idx];
  86. var model = axis.model;
  87. var scale = axis.scale;
  88. if (
  89. // Only value and log axis without interval support alignTicks.
  90. isIntervalOrLogScale(scale) && model.get('alignTicks') && model.get('interval') == null) {
  91. axisNeedsAlign.push(axis);
  92. } else {
  93. niceScaleExtent(scale, model);
  94. if (isIntervalOrLogScale(scale)) {
  95. // Can only align to interval or log axis.
  96. alignTo = axis;
  97. }
  98. }
  99. }
  100. ;
  101. // All axes has set alignTicks. Pick the first one.
  102. // PENDING. Should we find the axis that both set interval, min, max and align to this one?
  103. if (axisNeedsAlign.length) {
  104. if (!alignTo) {
  105. alignTo = axisNeedsAlign.pop();
  106. niceScaleExtent(alignTo.scale, alignTo.model);
  107. }
  108. each(axisNeedsAlign, function (axis) {
  109. alignScaleTicks(axis.scale, axis.model, alignTo.scale);
  110. });
  111. }
  112. }
  113. updateAxisTicks(axesMap.x);
  114. updateAxisTicks(axesMap.y);
  115. // Key: axisDim_axisIndex, value: boolean, whether onZero target.
  116. var onZeroRecords = {};
  117. each(axesMap.x, function (xAxis) {
  118. fixAxisOnZero(axesMap, 'y', xAxis, onZeroRecords);
  119. });
  120. each(axesMap.y, function (yAxis) {
  121. fixAxisOnZero(axesMap, 'x', yAxis, onZeroRecords);
  122. });
  123. // Resize again if containLabel is enabled
  124. // FIXME It may cause getting wrong grid size in data processing stage
  125. this.resize(this.model, api);
  126. };
  127. /**
  128. * Resize the grid
  129. */
  130. Grid.prototype.resize = function (gridModel, api, ignoreContainLabel) {
  131. var boxLayoutParams = gridModel.getBoxLayoutParams();
  132. var isContainLabel = !ignoreContainLabel && gridModel.get('containLabel');
  133. var gridRect = getLayoutRect(boxLayoutParams, {
  134. width: api.getWidth(),
  135. height: api.getHeight()
  136. });
  137. this._rect = gridRect;
  138. var axesList = this._axesList;
  139. adjustAxes();
  140. // Minus label size
  141. if (isContainLabel) {
  142. each(axesList, function (axis) {
  143. if (!axis.model.get(['axisLabel', 'inside'])) {
  144. var labelUnionRect = estimateLabelUnionRect(axis);
  145. if (labelUnionRect) {
  146. var dim = axis.isHorizontal() ? 'height' : 'width';
  147. var margin = axis.model.get(['axisLabel', 'margin']);
  148. gridRect[dim] -= labelUnionRect[dim] + margin;
  149. if (axis.position === 'top') {
  150. gridRect.y += labelUnionRect.height + margin;
  151. } else if (axis.position === 'left') {
  152. gridRect.x += labelUnionRect.width + margin;
  153. }
  154. }
  155. }
  156. });
  157. adjustAxes();
  158. }
  159. each(this._coordsList, function (coord) {
  160. // Calculate affine matrix to accelerate the data to point transform.
  161. // If all the axes scales are time or value.
  162. coord.calcAffineTransform();
  163. });
  164. function adjustAxes() {
  165. each(axesList, function (axis) {
  166. var isHorizontal = axis.isHorizontal();
  167. var extent = isHorizontal ? [0, gridRect.width] : [0, gridRect.height];
  168. var idx = axis.inverse ? 1 : 0;
  169. axis.setExtent(extent[idx], extent[1 - idx]);
  170. updateAxisTransform(axis, isHorizontal ? gridRect.x : gridRect.y);
  171. });
  172. }
  173. };
  174. Grid.prototype.getAxis = function (dim, axisIndex) {
  175. var axesMapOnDim = this._axesMap[dim];
  176. if (axesMapOnDim != null) {
  177. return axesMapOnDim[axisIndex || 0];
  178. }
  179. };
  180. Grid.prototype.getAxes = function () {
  181. return this._axesList.slice();
  182. };
  183. Grid.prototype.getCartesian = function (xAxisIndex, yAxisIndex) {
  184. if (xAxisIndex != null && yAxisIndex != null) {
  185. var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
  186. return this._coordsMap[key];
  187. }
  188. if (isObject(xAxisIndex)) {
  189. yAxisIndex = xAxisIndex.yAxisIndex;
  190. xAxisIndex = xAxisIndex.xAxisIndex;
  191. }
  192. for (var i = 0, coordList = this._coordsList; i < coordList.length; i++) {
  193. if (coordList[i].getAxis('x').index === xAxisIndex || coordList[i].getAxis('y').index === yAxisIndex) {
  194. return coordList[i];
  195. }
  196. }
  197. };
  198. Grid.prototype.getCartesians = function () {
  199. return this._coordsList.slice();
  200. };
  201. /**
  202. * @implements
  203. */
  204. Grid.prototype.convertToPixel = function (ecModel, finder, value) {
  205. var target = this._findConvertTarget(finder);
  206. return target.cartesian ? target.cartesian.dataToPoint(value) : target.axis ? target.axis.toGlobalCoord(target.axis.dataToCoord(value)) : null;
  207. };
  208. /**
  209. * @implements
  210. */
  211. Grid.prototype.convertFromPixel = function (ecModel, finder, value) {
  212. var target = this._findConvertTarget(finder);
  213. return target.cartesian ? target.cartesian.pointToData(value) : target.axis ? target.axis.coordToData(target.axis.toLocalCoord(value)) : null;
  214. };
  215. Grid.prototype._findConvertTarget = function (finder) {
  216. var seriesModel = finder.seriesModel;
  217. var xAxisModel = finder.xAxisModel || seriesModel && seriesModel.getReferringComponents('xAxis', SINGLE_REFERRING).models[0];
  218. var yAxisModel = finder.yAxisModel || seriesModel && seriesModel.getReferringComponents('yAxis', SINGLE_REFERRING).models[0];
  219. var gridModel = finder.gridModel;
  220. var coordsList = this._coordsList;
  221. var cartesian;
  222. var axis;
  223. if (seriesModel) {
  224. cartesian = seriesModel.coordinateSystem;
  225. indexOf(coordsList, cartesian) < 0 && (cartesian = null);
  226. } else if (xAxisModel && yAxisModel) {
  227. cartesian = this.getCartesian(xAxisModel.componentIndex, yAxisModel.componentIndex);
  228. } else if (xAxisModel) {
  229. axis = this.getAxis('x', xAxisModel.componentIndex);
  230. } else if (yAxisModel) {
  231. axis = this.getAxis('y', yAxisModel.componentIndex);
  232. }
  233. // Lowest priority.
  234. else if (gridModel) {
  235. var grid = gridModel.coordinateSystem;
  236. if (grid === this) {
  237. cartesian = this._coordsList[0];
  238. }
  239. }
  240. return {
  241. cartesian: cartesian,
  242. axis: axis
  243. };
  244. };
  245. /**
  246. * @implements
  247. */
  248. Grid.prototype.containPoint = function (point) {
  249. var coord = this._coordsList[0];
  250. if (coord) {
  251. return coord.containPoint(point);
  252. }
  253. };
  254. /**
  255. * Initialize cartesian coordinate systems
  256. */
  257. Grid.prototype._initCartesian = function (gridModel, ecModel, api) {
  258. var _this = this;
  259. var grid = this;
  260. var axisPositionUsed = {
  261. left: false,
  262. right: false,
  263. top: false,
  264. bottom: false
  265. };
  266. var axesMap = {
  267. x: {},
  268. y: {}
  269. };
  270. var axesCount = {
  271. x: 0,
  272. y: 0
  273. };
  274. // Create axis
  275. ecModel.eachComponent('xAxis', createAxisCreator('x'), this);
  276. ecModel.eachComponent('yAxis', createAxisCreator('y'), this);
  277. if (!axesCount.x || !axesCount.y) {
  278. // Roll back when there no either x or y axis
  279. this._axesMap = {};
  280. this._axesList = [];
  281. return;
  282. }
  283. this._axesMap = axesMap;
  284. // Create cartesian2d
  285. each(axesMap.x, function (xAxis, xAxisIndex) {
  286. each(axesMap.y, function (yAxis, yAxisIndex) {
  287. var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
  288. var cartesian = new Cartesian2D(key);
  289. cartesian.master = _this;
  290. cartesian.model = gridModel;
  291. _this._coordsMap[key] = cartesian;
  292. _this._coordsList.push(cartesian);
  293. cartesian.addAxis(xAxis);
  294. cartesian.addAxis(yAxis);
  295. });
  296. });
  297. function createAxisCreator(dimName) {
  298. return function (axisModel, idx) {
  299. if (!isAxisUsedInTheGrid(axisModel, gridModel)) {
  300. return;
  301. }
  302. var axisPosition = axisModel.get('position');
  303. if (dimName === 'x') {
  304. // Fix position
  305. if (axisPosition !== 'top' && axisPosition !== 'bottom') {
  306. // Default bottom of X
  307. axisPosition = axisPositionUsed.bottom ? 'top' : 'bottom';
  308. }
  309. } else {
  310. // Fix position
  311. if (axisPosition !== 'left' && axisPosition !== 'right') {
  312. // Default left of Y
  313. axisPosition = axisPositionUsed.left ? 'right' : 'left';
  314. }
  315. }
  316. axisPositionUsed[axisPosition] = true;
  317. var axis = new Axis2D(dimName, createScaleByModel(axisModel), [0, 0], axisModel.get('type'), axisPosition);
  318. var isCategory = axis.type === 'category';
  319. axis.onBand = isCategory && axisModel.get('boundaryGap');
  320. axis.inverse = axisModel.get('inverse');
  321. // Inject axis into axisModel
  322. axisModel.axis = axis;
  323. // Inject axisModel into axis
  324. axis.model = axisModel;
  325. // Inject grid info axis
  326. axis.grid = grid;
  327. // Index of axis, can be used as key
  328. axis.index = idx;
  329. grid._axesList.push(axis);
  330. axesMap[dimName][idx] = axis;
  331. axesCount[dimName]++;
  332. };
  333. }
  334. };
  335. /**
  336. * Update cartesian properties from series.
  337. */
  338. Grid.prototype._updateScale = function (ecModel, gridModel) {
  339. // Reset scale
  340. each(this._axesList, function (axis) {
  341. axis.scale.setExtent(Infinity, -Infinity);
  342. if (axis.type === 'category') {
  343. var categorySortInfo = axis.model.get('categorySortInfo');
  344. axis.scale.setSortInfo(categorySortInfo);
  345. }
  346. });
  347. ecModel.eachSeries(function (seriesModel) {
  348. if (isCartesian2DSeries(seriesModel)) {
  349. var axesModelMap = findAxisModels(seriesModel);
  350. var xAxisModel = axesModelMap.xAxisModel;
  351. var yAxisModel = axesModelMap.yAxisModel;
  352. if (!isAxisUsedInTheGrid(xAxisModel, gridModel) || !isAxisUsedInTheGrid(yAxisModel, gridModel)) {
  353. return;
  354. }
  355. var cartesian = this.getCartesian(xAxisModel.componentIndex, yAxisModel.componentIndex);
  356. var data = seriesModel.getData();
  357. var xAxis = cartesian.getAxis('x');
  358. var yAxis = cartesian.getAxis('y');
  359. unionExtent(data, xAxis);
  360. unionExtent(data, yAxis);
  361. }
  362. }, this);
  363. function unionExtent(data, axis) {
  364. each(getDataDimensionsOnAxis(data, axis.dim), function (dim) {
  365. axis.scale.unionExtentFromData(data, dim);
  366. });
  367. }
  368. };
  369. /**
  370. * @param dim 'x' or 'y' or 'auto' or null/undefined
  371. */
  372. Grid.prototype.getTooltipAxes = function (dim) {
  373. var baseAxes = [];
  374. var otherAxes = [];
  375. each(this.getCartesians(), function (cartesian) {
  376. var baseAxis = dim != null && dim !== 'auto' ? cartesian.getAxis(dim) : cartesian.getBaseAxis();
  377. var otherAxis = cartesian.getOtherAxis(baseAxis);
  378. indexOf(baseAxes, baseAxis) < 0 && baseAxes.push(baseAxis);
  379. indexOf(otherAxes, otherAxis) < 0 && otherAxes.push(otherAxis);
  380. });
  381. return {
  382. baseAxes: baseAxes,
  383. otherAxes: otherAxes
  384. };
  385. };
  386. Grid.create = function (ecModel, api) {
  387. var grids = [];
  388. ecModel.eachComponent('grid', function (gridModel, idx) {
  389. var grid = new Grid(gridModel, ecModel, api);
  390. grid.name = 'grid_' + idx;
  391. // dataSampling requires axis extent, so resize
  392. // should be performed in create stage.
  393. grid.resize(gridModel, api, true);
  394. gridModel.coordinateSystem = grid;
  395. grids.push(grid);
  396. });
  397. // Inject the coordinateSystems into seriesModel
  398. ecModel.eachSeries(function (seriesModel) {
  399. if (!isCartesian2DSeries(seriesModel)) {
  400. return;
  401. }
  402. var axesModelMap = findAxisModels(seriesModel);
  403. var xAxisModel = axesModelMap.xAxisModel;
  404. var yAxisModel = axesModelMap.yAxisModel;
  405. var gridModel = xAxisModel.getCoordSysModel();
  406. if (process.env.NODE_ENV !== 'production') {
  407. if (!gridModel) {
  408. throw new Error('Grid "' + retrieve3(xAxisModel.get('gridIndex'), xAxisModel.get('gridId'), 0) + '" not found');
  409. }
  410. if (xAxisModel.getCoordSysModel() !== yAxisModel.getCoordSysModel()) {
  411. throw new Error('xAxis and yAxis must use the same grid');
  412. }
  413. }
  414. var grid = gridModel.coordinateSystem;
  415. seriesModel.coordinateSystem = grid.getCartesian(xAxisModel.componentIndex, yAxisModel.componentIndex);
  416. });
  417. return grids;
  418. };
  419. // For deciding which dimensions to use when creating list data
  420. Grid.dimensions = cartesian2DDimensions;
  421. return Grid;
  422. }();
  423. /**
  424. * Check if the axis is used in the specified grid.
  425. */
  426. function isAxisUsedInTheGrid(axisModel, gridModel) {
  427. return axisModel.getCoordSysModel() === gridModel;
  428. }
  429. function fixAxisOnZero(axesMap, otherAxisDim, axis,
  430. // Key: see `getOnZeroRecordKey`
  431. onZeroRecords) {
  432. axis.getAxesOnZeroOf = function () {
  433. // TODO: onZero of multiple axes.
  434. return otherAxisOnZeroOf ? [otherAxisOnZeroOf] : [];
  435. };
  436. // onZero can not be enabled in these two situations:
  437. // 1. When any other axis is a category axis.
  438. // 2. When no axis is cross 0 point.
  439. var otherAxes = axesMap[otherAxisDim];
  440. var otherAxisOnZeroOf;
  441. var axisModel = axis.model;
  442. var onZero = axisModel.get(['axisLine', 'onZero']);
  443. var onZeroAxisIndex = axisModel.get(['axisLine', 'onZeroAxisIndex']);
  444. if (!onZero) {
  445. return;
  446. }
  447. // If target axis is specified.
  448. if (onZeroAxisIndex != null) {
  449. if (canOnZeroToAxis(otherAxes[onZeroAxisIndex])) {
  450. otherAxisOnZeroOf = otherAxes[onZeroAxisIndex];
  451. }
  452. } else {
  453. // Find the first available other axis.
  454. for (var idx in otherAxes) {
  455. if (otherAxes.hasOwnProperty(idx) && canOnZeroToAxis(otherAxes[idx])
  456. // Consider that two Y axes on one value axis,
  457. // if both onZero, the two Y axes overlap.
  458. && !onZeroRecords[getOnZeroRecordKey(otherAxes[idx])]) {
  459. otherAxisOnZeroOf = otherAxes[idx];
  460. break;
  461. }
  462. }
  463. }
  464. if (otherAxisOnZeroOf) {
  465. onZeroRecords[getOnZeroRecordKey(otherAxisOnZeroOf)] = true;
  466. }
  467. function getOnZeroRecordKey(axis) {
  468. return axis.dim + '_' + axis.index;
  469. }
  470. }
  471. function canOnZeroToAxis(axis) {
  472. return axis && axis.type !== 'category' && axis.type !== 'time' && ifAxisCrossZero(axis);
  473. }
  474. function updateAxisTransform(axis, coordBase) {
  475. var axisExtent = axis.getExtent();
  476. var axisExtentSum = axisExtent[0] + axisExtent[1];
  477. // Fast transform
  478. axis.toGlobalCoord = axis.dim === 'x' ? function (coord) {
  479. return coord + coordBase;
  480. } : function (coord) {
  481. return axisExtentSum - coord + coordBase;
  482. };
  483. axis.toLocalCoord = axis.dim === 'x' ? function (coord) {
  484. return coord - coordBase;
  485. } : function (coord) {
  486. return axisExtentSum - coord + coordBase;
  487. };
  488. }
  489. export default Grid;