mirror of
https://github.com/koodiklinikka/palkkakysely.git
synced 2026-03-02 23:59:17 +00:00
Add React analysaattori
This commit is contained in:
36
analysaattori/src/App.tsx
Normal file
36
analysaattori/src/App.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
import React from 'react';
|
||||
import PivotTableUI from 'react-pivottable/PivotTableUI';
|
||||
import 'react-pivottable/pivottable.css';
|
||||
import TableRenderers from 'react-pivottable/TableRenderers';
|
||||
import createPlotlyComponent from 'react-plotly.js/factory';
|
||||
import createPlotlyRenderers from 'react-pivottable/PlotlyRenderers';
|
||||
import useSWR from "swr/esm";
|
||||
|
||||
const Plot = createPlotlyComponent(window.Plotly);
|
||||
const PlotlyRenderers = createPlotlyRenderers(Plot);
|
||||
const renderers = Object.assign({}, TableRenderers, PlotlyRenderers);
|
||||
|
||||
|
||||
function App() {
|
||||
const qs = new URLSearchParams(window.location.search);
|
||||
const [pivotState, setPivotState] = React.useState({});
|
||||
const dataSwr = useSWR(qs.get("url") || "/palkkakysely/data.json");
|
||||
if (!dataSwr.data) {
|
||||
if (dataSwr.error) {
|
||||
return <>Virhe ladatessa dataa: {`${dataSwr.error}`}</>;
|
||||
}
|
||||
return <>Ladataan...</>;
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<PivotTableUI
|
||||
data={dataSwr.data}
|
||||
renderers={renderers}
|
||||
onChange={setPivotState}
|
||||
{...pivotState}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
Reference in New Issue
Block a user