47 lines
883 B
TypeScript
47 lines
883 B
TypeScript
import useDemoConfig from "../ChartConfig";
|
|
import React from "react";
|
|
import { AxisOptions, Chart } from "react-charts";
|
|
import './index.css'
|
|
|
|
export default function SparkChart() {
|
|
const { data } = useDemoConfig({
|
|
series: 1,
|
|
dataType: "time",
|
|
});
|
|
|
|
const primaryAxis = React.useMemo<
|
|
AxisOptions<typeof data[number]["data"][number]>
|
|
>(
|
|
() => ({
|
|
getValue: (datum) => datum.primary as unknown as Date,
|
|
show: false,
|
|
}),
|
|
[]
|
|
);
|
|
|
|
const secondaryAxes = React.useMemo<
|
|
AxisOptions<typeof data[number]["data"][number]>[]
|
|
>(
|
|
() => [
|
|
{
|
|
getValue: (datum) => datum.secondary,
|
|
show: false,
|
|
showDatumElements: false,
|
|
},
|
|
],
|
|
[]
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<Chart
|
|
options={{
|
|
data,
|
|
primaryAxis,
|
|
secondaryAxes,
|
|
}}
|
|
/>
|
|
</>
|
|
);
|
|
}
|