box.js 3.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. import { baseGeometryChannels, basePostInference, basePreInference, tooltip1d, } from './utils';
  2. /**
  3. * Convert value for each channel to box shapes.
  4. *
  5. * p0 p2 p1
  6. * ──────────┬──────────
  7. * │
  8. * │
  9. * │
  10. * │
  11. * │
  12. * │
  13. * │ p3
  14. * p4 ┌─────────┴──────────┐ p5
  15. * │ │
  16. * │ │
  17. * p8 ├────────────────────┤ p9
  18. * │ │
  19. * │ p10 │
  20. * p7 └─────────┬──────────┘ p6
  21. * │
  22. * │
  23. * │
  24. * │
  25. * │
  26. * │
  27. * │
  28. * │
  29. * ───────────┴───────────
  30. * p12 p11 p13
  31. */
  32. export const Box = () => {
  33. return (index, scale, value, coordinate) => {
  34. const { x: X, y: Y, y1: Y1, y2: Y2, y3: Y3, y4: Y4, series: S } = value;
  35. // Calc width for each box.
  36. // The scales for x and series channels must be band scale.
  37. const xScale = scale.x;
  38. const series = scale.series;
  39. const P = Array.from(index, (i) => {
  40. const groupWidth = xScale.getBandWidth(xScale.invert(+X[i]));
  41. const ratio = series ? series.getBandWidth(series.invert(+(S === null || S === void 0 ? void 0 : S[i]))) : 1;
  42. const width = groupWidth * ratio;
  43. const offset = (+(S === null || S === void 0 ? void 0 : S[i]) || 0) * groupWidth;
  44. const x = +X[i] + offset + width / 2;
  45. const [low, q1, median, q3, high] = [
  46. +Y[i],
  47. +Y1[i],
  48. +Y2[i],
  49. +Y3[i],
  50. +Y4[i],
  51. ];
  52. const P13 = [
  53. [x - width / 2, high],
  54. [x + width / 2, high],
  55. [x, high],
  56. [x, q3],
  57. [x - width / 2, q3],
  58. [x + width / 2, q3],
  59. [x + width / 2, q1],
  60. [x - width / 2, q1],
  61. [x - width / 2, median],
  62. [x + width / 2, median],
  63. [x, q1],
  64. [x, low],
  65. [x - width / 2, low],
  66. [x + width / 2, low],
  67. ];
  68. return P13.map((d) => coordinate.map(d));
  69. });
  70. return [index, P];
  71. };
  72. };
  73. Box.props = {
  74. defaultShape: 'box',
  75. defaultLabelShape: 'label',
  76. composite: false,
  77. channels: [
  78. ...baseGeometryChannels({ shapes: ['box'] }),
  79. { name: 'x', scale: 'band', required: true },
  80. { name: 'y', required: true },
  81. { name: 'series', scale: 'band' },
  82. ],
  83. preInference: [...basePreInference(), { type: 'maybeZeroX' }],
  84. postInference: [...basePostInference(), ...tooltip1d()],
  85. interaction: {
  86. shareTooltip: true,
  87. },
  88. };
  89. //# sourceMappingURL=box.js.map