UNPKG

@grafana/ui

Version:
1 lines 5.42 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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"}