config/Options/interaction/subchart.ts

  1. /**
  2. * Copyright (c) 2017 ~ present NAVER Corp.
  3. * billboard.js project is licensed under the MIT license
  4. */
  5. /**
  6. * x Axis config options
  7. */
  8. export default {
  9. /**
  10. * Set subchart options.
  11. * - **NOTE:** Not supported for `bubble`, `scatter` and non-Axis based(pie, donut, gauge, radar) types.
  12. * @name subchart
  13. * @memberof Options
  14. * @type {object}
  15. * @property {object} subchart Subchart object
  16. * @property {boolean} [subchart.show=false] Show sub chart on the bottom of the chart.
  17. * - **NOTE:** for ESM imports, needs to import 'subchart' exports and instantiate it by calling `subchart()`.
  18. * - `show: subchart()`
  19. * @property {boolean} [subchart.showHandle=false] Show sub chart's handle.
  20. * @property {boolean} [subchart.axis.x.show=true] Show or hide x axis.
  21. * @property {boolean} [subchart.axis.x.tick.show=true] Show or hide x axis tick line.
  22. * @property {Function|string} [subchart.axis.x.tick.format] Use custom format for x axis ticks - see [axis.x.tick.format](#.axis․x․tick․format) for details.
  23. * @property {boolean} [subchart.axis.x.tick.text.show=true] Show or hide x axis tick text.
  24. * @property {Array} [subchart.init.range] Set initial selection domain range.
  25. * @property {number} [subchart.size.height] Change the height of the subchart.
  26. * @property {Function} [subchart.onbrush] Set callback for brush event.<br>
  27. * Specified function receives the current zoomed x domain.
  28. * @see [Demo](https://naver.github.io/billboard.js/demo/#Interaction.SubChart)
  29. * @example
  30. * subchart: {
  31. * show: true,
  32. * showHandle: true,
  33. * size: {
  34. * height: 20
  35. * },
  36. * init: {
  37. * // specify initial range domain selection
  38. * range: [1, 2]
  39. * },
  40. * axis: {
  41. * x: {
  42. * show: true,
  43. * tick: {
  44. * show: true,
  45. * format: (x) => d3Format(".1f")(x)
  46. * text: {
  47. * show: false
  48. * }
  49. * }
  50. * }
  51. * },
  52. * onbrush: function(domain) { ... }
  53. * }
  54. * @example
  55. * // importing ESM
  56. * import bb, {subchart} from "billboard.js";
  57. *
  58. * subchart: {
  59. * show: subchart(),
  60. * ...
  61. * }
  62. */
  63. subchart_show: false,
  64. subchart_showHandle: false,
  65. subchart_size_height: 60,
  66. subchart_axis_x_show: true,
  67. subchart_axis_x_tick_show: true,
  68. subchart_axis_x_tick_format: <Function | string | undefined>undefined,
  69. subchart_axis_x_tick_text_show: true,
  70. subchart_init_range: <undefined | [number, number]>undefined,
  71. subchart_onbrush: () => {}
  72. };