plot.d.ts 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. import EE from '@antv/event-emitter';
  2. import { Chart, View } from '@antv/g2';
  3. import { Annotation, Options, StateCondition, StateName, StateObject } from '../types';
  4. import { Adaptor } from './adaptor';
  5. /** 单独 pick 出来的用于基类的类型定义 */
  6. export type PickOptions = Pick<Options, 'width' | 'height' | 'padding' | 'appendPadding' | 'renderer' | 'pixelRatio' | 'autoFit' | 'syncViewPadding' | 'supportCSSTransform' | 'limitInPlot' | 'locale' | 'defaultInteractions'>;
  7. /** plot 图表容器的配置 */
  8. export declare const PLOT_CONTAINER_OPTIONS: string[];
  9. /**
  10. * 所有 plot 的基类
  11. */
  12. export declare abstract class Plot<O extends PickOptions> extends EE {
  13. /**
  14. * 获取默认的 options 配置项
  15. * 每个组件都可以复写
  16. */
  17. static getDefaultOptions(): any;
  18. /** plot 类型名称 */
  19. abstract readonly type: string;
  20. /** plot 的 schema 配置 */
  21. options: O;
  22. /** plot 绘制的 dom */
  23. readonly container: HTMLElement;
  24. /** G2 chart 实例 */
  25. chart: Chart;
  26. /** resizer unbind */
  27. private unbind;
  28. constructor(container: string | HTMLElement, options: O);
  29. /**
  30. * 创建 G2 实例
  31. */
  32. private createG2;
  33. /**
  34. * 计算默认的 chart 大小。逻辑简化:如果存在 width 或 height,则直接使用,否则使用容器大小
  35. * @param width
  36. * @param height
  37. */
  38. private getChartSize;
  39. /**
  40. * 绑定代理所有 G2 的事件
  41. */
  42. private bindEvents;
  43. /**
  44. * 获取默认的 options 配置项
  45. * 每个组件都可以复写
  46. */
  47. protected getDefaultOptions(): any;
  48. /**
  49. * 每个组件有自己的 schema adaptor
  50. */
  51. protected abstract getSchemaAdaptor(): Adaptor<O>;
  52. /**
  53. * 绘制
  54. */
  55. render(): void;
  56. /**
  57. * 更新: 更新配置且重新渲染
  58. * @param options
  59. */
  60. update(options: Partial<O>): void;
  61. /**
  62. * 更新配置
  63. * @param options
  64. */
  65. protected updateOption(options: Partial<O>): void;
  66. /**
  67. * 设置状态
  68. * @param type 状态类型,支持 'active' | 'inactive' | 'selected' 三种
  69. * @param conditions 条件,支持数组
  70. * @param status 是否激活,默认 true
  71. */
  72. setState(type: StateName, condition: StateCondition, status?: boolean): void;
  73. /**
  74. * 获取状态
  75. */
  76. getStates(): StateObject[];
  77. /**
  78. * 更新数据
  79. * @override
  80. * @param options
  81. */
  82. changeData(data: any): void;
  83. /**
  84. * 修改画布大小
  85. * @param width
  86. * @param height
  87. */
  88. changeSize(width: number, height: number): void;
  89. /**
  90. * 增加图表标注。通过 id 标识,如果匹配到,就做更新
  91. */
  92. addAnnotations(annotations: Annotation[], view?: View): void;
  93. /**
  94. * 删除图表标注。通过 id 标识,如果匹配到,就做删除
  95. */
  96. removeAnnotations(annotations: Array<{
  97. id: string;
  98. } & Partial<Annotation>>): void;
  99. /**
  100. * 销毁
  101. */
  102. destroy(): void;
  103. /**
  104. * 执行 adaptor 操作
  105. */
  106. protected execAdaptor(): void;
  107. /**
  108. * 当图表容器大小变化的时候,执行的函数
  109. */
  110. protected triggerResize(): void;
  111. /**
  112. * 绑定 dom 容器大小变化的事件
  113. */
  114. private bindSizeSensor;
  115. /**
  116. * 取消绑定
  117. */
  118. private unbindSizeSensor;
  119. }