diff --git a/src/components/charts/ChartTimeArchive.jsx b/src/components/charts/ChartTimeArchive.jsx index 042a236..d392104 100644 --- a/src/components/charts/ChartTimeArchive.jsx +++ b/src/components/charts/ChartTimeArchive.jsx @@ -22,12 +22,12 @@ const CreateDataset = (lineConfig) => { } const ChartOptions = { - responsive: true, + // responsive: true, // plugins:{ // legend:{ + // display: false, // maxHeight: 64, // fullSize: true, - // display: true, // posision:'chartArea', // align: 'start', // } diff --git a/src/components/charts/ChartTimeArchive.tsx b/src/components/charts/ChartTimeArchive.tsx deleted file mode 100644 index 5928d00..0000000 --- a/src/components/charts/ChartTimeArchive.tsx +++ /dev/null @@ -1,83 +0,0 @@ -import { useEffect, useState} from 'react'; -import {ChartTimeBase, ChartTimeData, ChartTimeDataParams} from './ChartTimeBase' - -const GetRandomColor = () => "#" + Math.floor(Math.random()*16777215).toString(16) - - -function GetOrCreateDatasetByLineConfig(data: ChartTimeData, lineConfig: LineConfig) { - let dataset = data?.datasets.find(d => d.label === lineConfig.label) - if (!dataset) { - let color = lineConfig.borderColor - ?? lineConfig.backgroundColor - ?? lineConfig.color - ?? GetRandomColor() - - dataset = { - label: lineConfig.label, - data: [], - backgroundColor: lineConfig.backgroundColor ?? color, - borderColor: lineConfig.borderColor ?? color, - borderWidth: lineConfig.borderWidth ?? 1, - borderDash: lineConfig.dash ?? [], - } - data.datasets.push(dataset); - } - return dataset -} - -export type LineConfig = { - type?: string - label: string - units?: string - xAccessorName: string - yAccessorName: string - color?: string - borderColor?: string - backgroundColor?: string - borderWidth?: number - dash?: number[] - labels?: any[] -} - -export type ChartTimeProps = { - label?: string, - yDisplay: Boolean, - lines: LineConfig[], - data: any[], - interval: number, -} - -export const ChartTimeArchive: React.FC = (props) => { - const [dataParams, setDataParams] = useState({ data: { datasets: [] }, yStart: new Date(), }) - - useEffect(() => { - if ((!props?.lines) - || (!props?.data) - || (props.lines.length === 0) - || (props.data.length === 0)) - return - - setDataParams((preDataParams) => { - props.lines.forEach(lineCfg => { - let dataset = GetOrCreateDatasetByLineConfig(preDataParams.data, lineCfg) - let points = props.data.map(dataItem => { - return { - x: dataItem[lineCfg.xAccessorName], - label:0, - y: new Date(dataItem[lineCfg.yAccessorName]) - } - }) - dataset.data = points; - }); - - preDataParams.yStart = new Date() - preDataParams.yStart.setSeconds(preDataParams.yStart.getSeconds() - props.interval) - preDataParams.yInterval = props.interval - preDataParams.displayLabels = props.yDisplay - return preDataParams - }) - - }, [props.data, props.lines, props.interval, props.yDisplay]) - - return () -} \ No newline at end of file