diff options
Diffstat (limited to 'frontend/src/components/app/sidebars/elements/LoadChartComponent.js')
| -rw-r--r-- | frontend/src/components/app/sidebars/elements/LoadChartComponent.js | 84 |
1 files changed, 0 insertions, 84 deletions
diff --git a/frontend/src/components/app/sidebars/elements/LoadChartComponent.js b/frontend/src/components/app/sidebars/elements/LoadChartComponent.js deleted file mode 100644 index ae52891a..00000000 --- a/frontend/src/components/app/sidebars/elements/LoadChartComponent.js +++ /dev/null @@ -1,84 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/server' -import SvgSaver from 'svgsaver' -import { VictoryAxis, VictoryChart, VictoryLabel, VictoryLine, VictoryScatter } from 'victory' -import { convertSecondsToFormattedTime } from '../../../../util/date-time' - -const LoadChartComponent = ({ data, currentTick }) => { - const onExport = () => { - const div = document.createElement('div') - div.innerHTML = ReactDOM.renderToString( - <VictoryChartComponent - data={data} - currentTick={currentTick} - showCurrentTick={false} - />, - ) - div.firstChild.style = - 'font-family: Roboto, Arial, sans-serif; font-size: 10pt;' - const svgSaver = new SvgSaver() - svgSaver.asSvg( - div.firstChild, - 'opendc-chart-export-' + Date.now() + '.svg', - ) - } - - return ( - <div className="mt-1" style={{ position: 'relative' }}> - <strong>Load over time</strong> - <VictoryChartComponent - data={data} - currentTick={currentTick} - showCurrentTick={true} - /> - <ExportChartComponent onExport={onExport}/> - </div> - ) -} - -const VictoryChartComponent = ({ data, currentTick, showCurrentTick }) => ( - <VictoryChart - height={250} - padding={{ top: 10, bottom: 50, left: 50, right: 50 }} - > - <VictoryAxis - tickFormat={tick => convertSecondsToFormattedTime(tick)} - fixLabelOverlap={true} - label="Simulated Time" - /> - <VictoryAxis dependentAxis label="Load"/> - <VictoryLine data={data}/> - <VictoryScatter data={data}/> - {showCurrentTick ? ( - <VictoryLine - labelComponent={ - <VictoryLabel renderInPortal angle={90} dy={-5} dx={60}/> - } - data={[{ x: currentTick + 1, y: 0 }, { x: currentTick + 1, y: 1 }]} - labels={point => - point.y === 1 - ? 'Current tick : ' + convertSecondsToFormattedTime(currentTick) - : ''} - style={{ - data: { stroke: '#00A6D6', strokeWidth: 4 }, - labels: { fill: '#00A6D6' }, - }} - /> - ) : ( - undefined - )} - </VictoryChart> -) - -const ExportChartComponent = ({ onExport }) => ( - <button - className="btn btn-success btn-circle btn-sm" - title="Export Chart to PNG Image" - onClick={onExport} - style={{ position: 'absolute', top: 0, right: 0 }} - > - <span className="fa fa-camera"/> - </button> -) - -export default LoadChartComponent |
