grafana/public/app/core/components/TimeSeries/TimeSeries.tsx

63 lines
1.8 KiB
TypeScript

import { Component } from 'react';
import { DataFrame, TimeRange } from '@grafana/data';
import { withTheme2 } from '@grafana/ui';
import { hasVisibleLegendSeries, PlotLegend, UPlotConfigBuilder } from '@grafana/ui/internal';
import { GraphNG, GraphNGProps, PropDiffFn } from '../GraphNG/GraphNG';
import { calculateAnnotationLaneSizes, preparePlotConfigBuilder } from './utils';
const propsToDiff: Array<string | PropDiffFn> = ['legend', 'options', 'theme'];
type TimeSeriesProps = Omit<GraphNGProps, 'prepConfig' | 'propsToDiff' | 'renderLegend'>;
export class UnthemedTimeSeries extends Component<TimeSeriesProps> {
prepConfig = (
alignedFrame: DataFrame,
allFrames: DataFrame[],
getTimeRange: () => TimeRange,
annotationLanes?: number
) => {
const { theme, timeZone, options, renderers, tweakAxis, tweakScale } = this.props;
return preparePlotConfigBuilder({
frame: alignedFrame,
theme,
timeZones: Array.isArray(timeZone) ? timeZone : [timeZone],
getTimeRange,
allFrames,
renderers,
tweakScale,
tweakAxis,
hoverProximity: options?.tooltip?.hoverProximity,
orientation: options?.orientation,
xAxisConfig: calculateAnnotationLaneSizes(annotationLanes, options?.annotations),
});
};
renderLegend = (config: UPlotConfigBuilder) => {
const { legend, frames } = this.props;
if (!config || (legend && !legend.showLegend) || !hasVisibleLegendSeries(config, frames)) {
return null;
}
return <PlotLegend data={frames} config={config} {...legend} />;
};
render() {
return (
<GraphNG
{...this.props}
prepConfig={this.prepConfig}
propsToDiff={propsToDiff}
renderLegend={this.renderLegend}
/>
);
}
}
export const TimeSeries = withTheme2(UnthemedTimeSeries);
TimeSeries.displayName = 'TimeSeries';