boxplotLayout.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. var zrUtil = require("zrender/lib/core/util");
  2. var _number = require("../../util/number");
  3. var parsePercent = _number.parsePercent;
  4. var each = zrUtil.each;
  5. function _default(ecModel) {
  6. var groupResult = groupSeriesByAxis(ecModel);
  7. each(groupResult, function (groupItem) {
  8. var seriesModels = groupItem.seriesModels;
  9. if (!seriesModels.length) {
  10. return;
  11. }
  12. calculateBase(groupItem);
  13. each(seriesModels, function (seriesModel, idx) {
  14. layoutSingleSeries(seriesModel, groupItem.boxOffsetList[idx], groupItem.boxWidthList[idx]);
  15. });
  16. });
  17. }
  18. /**
  19. * Group series by axis.
  20. */
  21. function groupSeriesByAxis(ecModel) {
  22. var result = [];
  23. var axisList = [];
  24. ecModel.eachSeriesByType('boxplot', function (seriesModel) {
  25. var baseAxis = seriesModel.getBaseAxis();
  26. var idx = zrUtil.indexOf(axisList, baseAxis);
  27. if (idx < 0) {
  28. idx = axisList.length;
  29. axisList[idx] = baseAxis;
  30. result[idx] = {
  31. axis: baseAxis,
  32. seriesModels: []
  33. };
  34. }
  35. result[idx].seriesModels.push(seriesModel);
  36. });
  37. return result;
  38. }
  39. /**
  40. * Calculate offset and box width for each series.
  41. */
  42. function calculateBase(groupItem) {
  43. var extent;
  44. var baseAxis = groupItem.axis;
  45. var seriesModels = groupItem.seriesModels;
  46. var seriesCount = seriesModels.length;
  47. var boxWidthList = groupItem.boxWidthList = [];
  48. var boxOffsetList = groupItem.boxOffsetList = [];
  49. var boundList = [];
  50. var bandWidth;
  51. if (baseAxis.type === 'category') {
  52. bandWidth = baseAxis.getBandWidth();
  53. } else {
  54. var maxDataCount = 0;
  55. each(seriesModels, function (seriesModel) {
  56. maxDataCount = Math.max(maxDataCount, seriesModel.getData().count());
  57. });
  58. extent = baseAxis.getExtent(), Math.abs(extent[1] - extent[0]) / maxDataCount;
  59. }
  60. each(seriesModels, function (seriesModel) {
  61. var boxWidthBound = seriesModel.get('boxWidth');
  62. if (!zrUtil.isArray(boxWidthBound)) {
  63. boxWidthBound = [boxWidthBound, boxWidthBound];
  64. }
  65. boundList.push([parsePercent(boxWidthBound[0], bandWidth) || 0, parsePercent(boxWidthBound[1], bandWidth) || 0]);
  66. });
  67. var availableWidth = bandWidth * 0.8 - 2;
  68. var boxGap = availableWidth / seriesCount * 0.3;
  69. var boxWidth = (availableWidth - boxGap * (seriesCount - 1)) / seriesCount;
  70. var base = boxWidth / 2 - availableWidth / 2;
  71. each(seriesModels, function (seriesModel, idx) {
  72. boxOffsetList.push(base);
  73. base += boxGap + boxWidth;
  74. boxWidthList.push(Math.min(Math.max(boxWidth, boundList[idx][0]), boundList[idx][1]));
  75. });
  76. }
  77. /**
  78. * Calculate points location for each series.
  79. */
  80. function layoutSingleSeries(seriesModel, offset, boxWidth) {
  81. var coordSys = seriesModel.coordinateSystem;
  82. var data = seriesModel.getData();
  83. var halfWidth = boxWidth / 2;
  84. var chartLayout = seriesModel.get('layout');
  85. var variableDim = chartLayout === 'horizontal' ? 0 : 1;
  86. var constDim = 1 - variableDim;
  87. var coordDims = ['x', 'y'];
  88. var vDims = [];
  89. var cDim;
  90. zrUtil.each(data.dimensions, function (dimName) {
  91. var dimInfo = data.getDimensionInfo(dimName);
  92. var coordDim = dimInfo.coordDim;
  93. if (coordDim === coordDims[constDim]) {
  94. vDims.push(dimName);
  95. } else if (coordDim === coordDims[variableDim]) {
  96. cDim = dimName;
  97. }
  98. });
  99. if (cDim == null || vDims.length < 5) {
  100. return;
  101. }
  102. data.each([cDim].concat(vDims), function () {
  103. var args = arguments;
  104. var axisDimVal = args[0];
  105. var idx = args[vDims.length + 1];
  106. var median = getPoint(args[3]);
  107. var end1 = getPoint(args[1]);
  108. var end5 = getPoint(args[5]);
  109. var whiskerEnds = [[end1, getPoint(args[2])], [end5, getPoint(args[4])]];
  110. layEndLine(end1);
  111. layEndLine(end5);
  112. layEndLine(median);
  113. var bodyEnds = [];
  114. addBodyEnd(whiskerEnds[0][1], 0);
  115. addBodyEnd(whiskerEnds[1][1], 1);
  116. data.setItemLayout(idx, {
  117. chartLayout: chartLayout,
  118. initBaseline: median[constDim],
  119. median: median,
  120. bodyEnds: bodyEnds,
  121. whiskerEnds: whiskerEnds
  122. });
  123. function getPoint(val) {
  124. var p = [];
  125. p[variableDim] = axisDimVal;
  126. p[constDim] = val;
  127. var point;
  128. if (isNaN(axisDimVal) || isNaN(val)) {
  129. point = [NaN, NaN];
  130. } else {
  131. point = coordSys.dataToPoint(p);
  132. point[variableDim] += offset;
  133. }
  134. return point;
  135. }
  136. function addBodyEnd(point, start) {
  137. var point1 = point.slice();
  138. var point2 = point.slice();
  139. point1[variableDim] += halfWidth;
  140. point2[variableDim] -= halfWidth;
  141. start ? bodyEnds.push(point1, point2) : bodyEnds.push(point2, point1);
  142. }
  143. function layEndLine(endCenter) {
  144. var line = [endCenter.slice(), endCenter.slice()];
  145. line[0][variableDim] -= halfWidth;
  146. line[1][variableDim] += halfWidth;
  147. whiskerEnds.push(line);
  148. }
  149. });
  150. }
  151. module.exports = _default;