2562781e3e
The current app at root of repo is for single frictionless dataset. Should be in its own example so we have space going forward for multiple example and for root to have core portal.js code. * Also refactor its README (moved from root) to reflect it is just an example * Move design content from the root README.md into DESIGN.md * Stub a new root README.md based largely on examples/catalog/README.md
31 lines
818 B
JavaScript
31 lines
818 B
JavaScript
import React, { useState, useEffect } from 'react';
|
|
import createPlotlyComponent from "react-plotly.js/factory";
|
|
|
|
let Plot;
|
|
|
|
const Chart = (props) => {
|
|
const [plotCreated, setPlotCreated] = useState(0) //0: false, 1: true
|
|
|
|
useEffect(() => {
|
|
import(`plotly.js-basic-dist`).then(Plotly => { //import Plotly dist when Page has been generated
|
|
Plot = createPlotlyComponent(Plotly);
|
|
setPlotCreated(1)
|
|
});
|
|
}, [])
|
|
|
|
if (!plotCreated) {
|
|
return (<div>Loading...</div>)
|
|
}
|
|
|
|
return (
|
|
<div data-testid="plotlyChart">
|
|
<Plot {...props.spec}
|
|
layout={{ autosize: true }}
|
|
style={{ width: "100%", height: "100%" }}
|
|
useResizeHandler={true}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Chart
|