barGrid.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. var zrUtil = require("zrender/lib/core/util");
  2. var _number = require("../util/number");
  3. var parsePercent = _number.parsePercent;
  4. var STACK_PREFIX = '__ec_stack_';
  5. function getSeriesStackId(seriesModel) {
  6. return seriesModel.get('stack') || STACK_PREFIX + seriesModel.seriesIndex;
  7. }
  8. function getAxisKey(axis) {
  9. return axis.dim + axis.index;
  10. }
  11. /**
  12. * @param {Object} opt
  13. * @param {module:echarts/coord/Axis} opt.axis Only support category axis currently.
  14. * @param {number} opt.count Positive interger.
  15. * @param {number} [opt.barWidth]
  16. * @param {number} [opt.barMaxWidth]
  17. * @param {number} [opt.barGap]
  18. * @param {number} [opt.barCategoryGap]
  19. * @return {Object} {width, offset, offsetCenter} If axis.type is not 'category', return undefined.
  20. */
  21. function getLayoutOnAxis(opt, api) {
  22. var params = [];
  23. var baseAxis = opt.axis;
  24. var axisKey = 'axis0';
  25. if (baseAxis.type !== 'category') {
  26. return;
  27. }
  28. var bandWidth = baseAxis.getBandWidth();
  29. for (var i = 0; i < opt.count || 0; i++) {
  30. params.push(zrUtil.defaults({
  31. bandWidth: bandWidth,
  32. axisKey: axisKey,
  33. stackId: STACK_PREFIX + i
  34. }, opt));
  35. }
  36. var widthAndOffsets = doCalBarWidthAndOffset(params, api);
  37. var result = [];
  38. for (var i = 0; i < opt.count; i++) {
  39. var item = widthAndOffsets[axisKey][STACK_PREFIX + i];
  40. item.offsetCenter = item.offset + item.width / 2;
  41. result.push(item);
  42. }
  43. return result;
  44. }
  45. function calBarWidthAndOffset(barSeries, api) {
  46. var seriesInfoList = zrUtil.map(barSeries, function (seriesModel) {
  47. var data = seriesModel.getData();
  48. var cartesian = seriesModel.coordinateSystem;
  49. var baseAxis = cartesian.getBaseAxis();
  50. var axisExtent = baseAxis.getExtent();
  51. var bandWidth = baseAxis.type === 'category' ? baseAxis.getBandWidth() : Math.abs(axisExtent[1] - axisExtent[0]) / data.count();
  52. var barWidth = parsePercent(seriesModel.get('barWidth'), bandWidth);
  53. var barMaxWidth = parsePercent(seriesModel.get('barMaxWidth'), bandWidth);
  54. var barGap = seriesModel.get('barGap');
  55. var barCategoryGap = seriesModel.get('barCategoryGap');
  56. return {
  57. bandWidth: bandWidth,
  58. barWidth: barWidth,
  59. barMaxWidth: barMaxWidth,
  60. barGap: barGap,
  61. barCategoryGap: barCategoryGap,
  62. axisKey: getAxisKey(baseAxis),
  63. stackId: getSeriesStackId(seriesModel)
  64. };
  65. });
  66. return doCalBarWidthAndOffset(seriesInfoList, api);
  67. }
  68. function doCalBarWidthAndOffset(seriesInfoList, api) {
  69. // Columns info on each category axis. Key is cartesian name
  70. var columnsMap = {};
  71. zrUtil.each(seriesInfoList, function (seriesInfo, idx) {
  72. var axisKey = seriesInfo.axisKey;
  73. var bandWidth = seriesInfo.bandWidth;
  74. var columnsOnAxis = columnsMap[axisKey] || {
  75. bandWidth: bandWidth,
  76. remainedWidth: bandWidth,
  77. autoWidthCount: 0,
  78. categoryGap: '20%',
  79. gap: '30%',
  80. stacks: {}
  81. };
  82. var stacks = columnsOnAxis.stacks;
  83. columnsMap[axisKey] = columnsOnAxis;
  84. var stackId = seriesInfo.stackId;
  85. if (!stacks[stackId]) {
  86. columnsOnAxis.autoWidthCount++;
  87. }
  88. stacks[stackId] = stacks[stackId] || {
  89. width: 0,
  90. maxWidth: 0
  91. }; // Caution: In a single coordinate system, these barGrid attributes
  92. // will be shared by series. Consider that they have default values,
  93. // only the attributes set on the last series will work.
  94. // Do not change this fact unless there will be a break change.
  95. // TODO
  96. var barWidth = seriesInfo.barWidth;
  97. if (barWidth && !stacks[stackId].width) {
  98. // See #6312, do not restrict width.
  99. stacks[stackId].width = barWidth;
  100. barWidth = Math.min(columnsOnAxis.remainedWidth, barWidth);
  101. columnsOnAxis.remainedWidth -= barWidth;
  102. }
  103. var barMaxWidth = seriesInfo.barMaxWidth;
  104. barMaxWidth && (stacks[stackId].maxWidth = barMaxWidth);
  105. var barGap = seriesInfo.barGap;
  106. barGap != null && (columnsOnAxis.gap = barGap);
  107. var barCategoryGap = seriesInfo.barCategoryGap;
  108. barCategoryGap != null && (columnsOnAxis.categoryGap = barCategoryGap);
  109. });
  110. var result = {};
  111. zrUtil.each(columnsMap, function (columnsOnAxis, coordSysName) {
  112. result[coordSysName] = {};
  113. var stacks = columnsOnAxis.stacks;
  114. var bandWidth = columnsOnAxis.bandWidth;
  115. var categoryGap = parsePercent(columnsOnAxis.categoryGap, bandWidth);
  116. var barGapPercent = parsePercent(columnsOnAxis.gap, 1);
  117. var remainedWidth = columnsOnAxis.remainedWidth;
  118. var autoWidthCount = columnsOnAxis.autoWidthCount;
  119. var autoWidth = (remainedWidth - categoryGap) / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
  120. autoWidth = Math.max(autoWidth, 0); // Find if any auto calculated bar exceeded maxBarWidth
  121. zrUtil.each(stacks, function (column, stack) {
  122. var maxWidth = column.maxWidth;
  123. if (maxWidth && maxWidth < autoWidth) {
  124. maxWidth = Math.min(maxWidth, remainedWidth);
  125. if (column.width) {
  126. maxWidth = Math.min(maxWidth, column.width);
  127. }
  128. remainedWidth -= maxWidth;
  129. column.width = maxWidth;
  130. autoWidthCount--;
  131. }
  132. }); // Recalculate width again
  133. autoWidth = (remainedWidth - categoryGap) / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
  134. autoWidth = Math.max(autoWidth, 0);
  135. var widthSum = 0;
  136. var lastColumn;
  137. zrUtil.each(stacks, function (column, idx) {
  138. if (!column.width) {
  139. column.width = autoWidth;
  140. }
  141. lastColumn = column;
  142. widthSum += column.width * (1 + barGapPercent);
  143. });
  144. if (lastColumn) {
  145. widthSum -= lastColumn.width * barGapPercent;
  146. }
  147. var offset = -widthSum / 2;
  148. zrUtil.each(stacks, function (column, stackId) {
  149. result[coordSysName][stackId] = result[coordSysName][stackId] || {
  150. offset: offset,
  151. width: column.width
  152. };
  153. offset += column.width * (1 + barGapPercent);
  154. });
  155. });
  156. return result;
  157. }
  158. /**
  159. * @param {string} seriesType
  160. * @param {module:echarts/model/Global} ecModel
  161. * @param {module:echarts/ExtensionAPI} api
  162. */
  163. function barLayoutGrid(seriesType, ecModel, api) {
  164. var barWidthAndOffset = calBarWidthAndOffset(zrUtil.filter(ecModel.getSeriesByType(seriesType), function (seriesModel) {
  165. return !ecModel.isSeriesFiltered(seriesModel) && seriesModel.coordinateSystem && seriesModel.coordinateSystem.type === 'cartesian2d';
  166. }));
  167. var lastStackCoords = {};
  168. var lastStackCoordsOrigin = {};
  169. ecModel.eachSeriesByType(seriesType, function (seriesModel) {
  170. // Check series coordinate, do layout for cartesian2d only
  171. if (seriesModel.coordinateSystem.type !== 'cartesian2d') {
  172. return;
  173. }
  174. var data = seriesModel.getData();
  175. var cartesian = seriesModel.coordinateSystem;
  176. var baseAxis = cartesian.getBaseAxis();
  177. var stackId = getSeriesStackId(seriesModel);
  178. var columnLayoutInfo = barWidthAndOffset[getAxisKey(baseAxis)][stackId];
  179. var columnOffset = columnLayoutInfo.offset;
  180. var columnWidth = columnLayoutInfo.width;
  181. var valueAxis = cartesian.getOtherAxis(baseAxis);
  182. var barMinHeight = seriesModel.get('barMinHeight') || 0;
  183. var valueAxisStart = baseAxis.onZero ? valueAxis.toGlobalCoord(valueAxis.dataToCoord(0)) : valueAxis.getGlobalExtent()[0];
  184. var coordDims = [seriesModel.coordDimToDataDim('x')[0], seriesModel.coordDimToDataDim('y')[0]];
  185. var coords = data.mapArray(coordDims, function (x, y) {
  186. return cartesian.dataToPoint([x, y]);
  187. }, true);
  188. lastStackCoords[stackId] = lastStackCoords[stackId] || [];
  189. lastStackCoordsOrigin[stackId] = lastStackCoordsOrigin[stackId] || []; // Fix #4243
  190. data.setLayout({
  191. offset: columnOffset,
  192. size: columnWidth
  193. });
  194. data.each(seriesModel.coordDimToDataDim(valueAxis.dim)[0], function (value, idx) {
  195. if (isNaN(value)) {
  196. return;
  197. }
  198. if (!lastStackCoords[stackId][idx]) {
  199. lastStackCoords[stackId][idx] = {
  200. p: valueAxisStart,
  201. // Positive stack
  202. n: valueAxisStart // Negative stack
  203. };
  204. lastStackCoordsOrigin[stackId][idx] = {
  205. p: valueAxisStart,
  206. // Positive stack
  207. n: valueAxisStart // Negative stack
  208. };
  209. }
  210. var sign = value >= 0 ? 'p' : 'n';
  211. var coord = coords[idx];
  212. var lastCoord = lastStackCoords[stackId][idx][sign];
  213. var lastCoordOrigin = lastStackCoordsOrigin[stackId][idx][sign];
  214. var x;
  215. var y;
  216. var width;
  217. var height;
  218. if (valueAxis.isHorizontal()) {
  219. x = lastCoord;
  220. y = coord[1] + columnOffset;
  221. width = coord[0] - lastCoordOrigin;
  222. height = columnWidth;
  223. lastStackCoordsOrigin[stackId][idx][sign] += width;
  224. if (Math.abs(width) < barMinHeight) {
  225. width = (width < 0 ? -1 : 1) * barMinHeight;
  226. }
  227. lastStackCoords[stackId][idx][sign] += width;
  228. } else {
  229. x = coord[0] + columnOffset;
  230. y = lastCoord;
  231. width = columnWidth;
  232. height = coord[1] - lastCoordOrigin;
  233. lastStackCoordsOrigin[stackId][idx][sign] += height;
  234. if (Math.abs(height) < barMinHeight) {
  235. // Include zero to has a positive bar
  236. height = (height <= 0 ? -1 : 1) * barMinHeight;
  237. }
  238. lastStackCoords[stackId][idx][sign] += height;
  239. }
  240. data.setItemLayout(idx, {
  241. x: x,
  242. y: y,
  243. width: width,
  244. height: height
  245. });
  246. }, true);
  247. }, this);
  248. }
  249. barLayoutGrid.getLayoutOnAxis = getLayoutOnAxis;
  250. var _default = barLayoutGrid;
  251. module.exports = _default;