UNPKG

@grafana/ui

Version:
1 lines 5.36 kB
{"version":3,"file":"Plot.mjs","sources":["../../../../src/components/uPlot/Plot.tsx"],"sourcesContent":["import { Component, createRef } from 'react';\nimport uPlot, { AlignedData, Options } from 'uplot';\n\nimport { PlotProps } from './types';\nimport { pluginLog } from './utils';\n\nimport 'uplot/dist/uPlot.min.css';\n\nfunction sameDims(prevProps: PlotProps, nextProps: PlotProps) {\n return nextProps.width === prevProps.width && nextProps.height === prevProps.height;\n}\n\nfunction sameData(prevProps: PlotProps, nextProps: PlotProps) {\n return nextProps.data === prevProps.data;\n}\n\nfunction sameConfig(prevProps: PlotProps, nextProps: PlotProps) {\n return nextProps.config === prevProps.config;\n}\n\ntype UPlotChartState = {\n plot: uPlot | null;\n};\n\n/**\n * @internal\n * uPlot abstraction responsible for plot initialisation, setup and refresh\n * Receives a data frame that is x-axis aligned, as of https://github.com/leeoniya/uPlot/tree/master/docs#data-format\n * Exposes context for uPlot instance access\n */\nexport class UPlotChart extends Component<PlotProps, UPlotChartState> {\n plotContainer = createRef<HTMLDivElement>();\n plotCanvasBBox = createRef<DOMRect>();\n plotInstance: uPlot | null = null;\n\n constructor(props: PlotProps) {\n super(props);\n }\n\n reinitPlot() {\n let { width, height, plotRef } = this.props;\n\n this.plotInstance?.destroy();\n\n if (width === 0 && height === 0) {\n return;\n }\n\n this.props.config.addHook('setSize', (u) => {\n const canvas = u.over;\n if (!canvas) {\n return;\n }\n });\n\n const config: Options = {\n width: Math.floor(this.props.width),\n height: Math.floor(this.props.height),\n ...this.props.config.getConfig(),\n };\n\n pluginLog('UPlot', false, 'Reinitializing plot', config);\n const plot = new uPlot(config, this.props.data as AlignedData, this.plotContainer!.current!);\n\n if (plotRef) {\n plotRef(plot);\n }\n\n this.plotInstance = plot;\n }\n\n componentDidMount() {\n this.reinitPlot();\n }\n\n componentWillUnmount() {\n this.plotInstance?.destroy();\n }\n\n componentDidUpdate(prevProps: PlotProps) {\n if (!sameDims(prevProps, this.props)) {\n this.plotInstance?.setSize({\n width: Math.floor(this.props.width),\n height: Math.floor(this.props.height),\n });\n } else if (!sameConfig(prevProps, this.props)) {\n this.reinitPlot();\n } else if (!sameData(prevProps, this.props)) {\n this.plotInstance?.setData(this.props.data as AlignedData);\n }\n }\n\n render() {\n return (\n <div style={{ position: 'relative' }}>\n <div ref={this.plotContainer} data-testid=\"uplot-main-div\" />\n {this.props.children}\n </div>\n );\n }\n}\n"],"names":[],"mappings":"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"}