echarts.tsx 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. import type {AxisPointerComponentOption, ECharts, LineSeriesOption} from 'echarts';
  2. import type ReactEchartsCore from 'echarts-for-react/lib/core';
  3. export type SeriesDataUnit = {
  4. name: string | number;
  5. value: number;
  6. itemStyle?: {
  7. color?: string;
  8. };
  9. // number because we sometimes use timestamps
  10. onClick?: (series: Series, instance: ECharts) => void;
  11. };
  12. export type Series = {
  13. data: SeriesDataUnit[];
  14. seriesName: string;
  15. areaStyle?: {
  16. color: string;
  17. opacity: number;
  18. };
  19. color?: string;
  20. lineStyle?: AxisPointerComponentOption['lineStyle'];
  21. // https://echarts.apache.org/en/option.html#series-line.z
  22. markLine?: LineSeriesOption['markLine'];
  23. stack?: string;
  24. // https://echarts.apache.org/en/option.html#series-line.stack
  25. z?: number;
  26. };
  27. export type ReactEchartsRef = ReactEchartsCore & {
  28. getEchartsInstance: () => ECharts;
  29. };
  30. export type EChartEventHandler<P> = (params: P, instance: ECharts) => void;
  31. export type EChartChartReadyHandler = (instance: ECharts) => void;
  32. export type EChartHighlightHandler = EChartEventHandler<any>;
  33. export type EChartMouseOverHandler = EChartEventHandler<any>;
  34. export type EChartClickHandler = EChartEventHandler<any>;
  35. export type EChartDataZoomHandler = EChartEventHandler<{
  36. /**
  37. * percentage of zoom finish position, 0 - 100
  38. */
  39. end: number;
  40. /**
  41. * percentage of zoom start position, 0 - 100
  42. */
  43. start: number;
  44. type: 'datazoom';
  45. /**
  46. * data value of zoom finish position; only exists in zoom event of
  47. * triggered by toolbar
  48. */
  49. endValue?: number;
  50. /**
  51. * data value of zoom start position; only exists in zoom event of
  52. * triggered by toolbar
  53. */
  54. startValue?: number;
  55. }>;
  56. export type EChartRestoreHandler = EChartEventHandler<{type: 'restore'}>;
  57. export type EChartFinishedHandler = EChartEventHandler<{}>;
  58. export type EChartRenderedHandler = EChartEventHandler<{}>;