aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DataVizBox/ChartBox.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2023-04-06 00:14:24 -0400
committerbobzel <zzzman@gmail.com>2023-04-06 00:14:24 -0400
commita8343cad405a146fdff8fc2d66ef41fdaefb8bda (patch)
tree853c9b24f6bec83e46240fd9c39e9487e8eb6650 /src/client/views/nodes/DataVizBox/ChartBox.tsx
parent99fba6d6e99da0154d40d2e3e87e120d8e6f2810 (diff)
more simplification/cleanup of dataviz
Diffstat (limited to 'src/client/views/nodes/DataVizBox/ChartBox.tsx')
-rw-r--r--src/client/views/nodes/DataVizBox/ChartBox.tsx100
1 files changed, 0 insertions, 100 deletions
diff --git a/src/client/views/nodes/DataVizBox/ChartBox.tsx b/src/client/views/nodes/DataVizBox/ChartBox.tsx
deleted file mode 100644
index ee577b9fd..000000000
--- a/src/client/views/nodes/DataVizBox/ChartBox.tsx
+++ /dev/null
@@ -1,100 +0,0 @@
-import { observer } from 'mobx-react';
-import * as React from 'react';
-import { Doc } from '../../../../fields/Doc';
-import { action, computed, observable } from 'mobx';
-import { NumCast, StrCast } from '../../../../fields/Types';
-import { LineChart } from './components/LineChart';
-import { Chart, ChartData } from './ChartInterface';
-import { PinProps } from '../trails';
-
-export interface ChartBoxProps {
- rootDoc: Doc;
- dataDoc: Doc;
- height: number;
- pairs: { x: number; y: number }[];
- setChartBox: (chartBox: ChartBox) => void;
- getAnchor: () => Doc;
-}
-
-export interface DataPoint {
- x: number;
- y: number;
-}
-
-@observer
-export class ChartBox extends React.Component<ChartBoxProps> {
- @observable private _chartData: ChartData | undefined = undefined;
- private currChart: Chart | undefined;
-
- @computed get currView() {
- if (this.props.rootDoc._dataVizView) {
- return StrCast(this.props.rootDoc._currChartView);
- } else {
- return 'table';
- }
- }
-
- constructor(props: any) {
- super(props);
- if (!this.props.rootDoc._currChartView) {
- this.props.rootDoc._currChartView = 'bar';
- }
- }
-
- setCurrChart = (chart: Chart) => {
- this.currChart = chart;
- };
-
- @action
- generateChartData() {
- if (this.props.rootDoc._chartData) {
- this._chartData = JSON.parse(StrCast(this.props.rootDoc._chartData));
- return;
- }
-
- const data: ChartData = {
- xLabel: '',
- yLabel: '',
- data: [[]],
- };
-
- if (this.props.pairs && this.props.pairs.length > 0) {
- data.xLabel = 'x';
- data.yLabel = 'y';
- this.props.pairs.forEach(pair => {
- // TODO: nda - add actual support for multiple sets of data
- data.data[0].push({ x: pair.x, y: pair.y });
- });
- }
-
- this._chartData = data;
- this.props.rootDoc._chartData = JSON.stringify(data);
- }
-
- componentDidMount = () => {
- this.generateChartData();
- this.props.setChartBox(this);
- };
-
- @action
- onClickChangeChart = (e: React.MouseEvent<HTMLButtonElement>) => {
- e.preventDefault();
- e.stopPropagation();
- console.log(e.currentTarget.value);
- this.props.rootDoc._currChartView = e.currentTarget.value.toLowerCase();
- };
-
- getAnchor = (pinProps?: PinProps) => this.currChart?._getAnchor(pinProps);
-
- restoreView = (data: Doc) => this.currChart?.restoreView(data);
-
- render() {
- if (this.props.pairs && this._chartData) {
- const width = NumCast(this.props.rootDoc._width) * 0.9;
- const height = this.props.height * 0.9;
- const margin = { top: 10, right: 50, bottom: 50, left: 50 };
- return <LineChart margin={margin} width={width} height={height} chartData={this._chartData} setCurrChart={this.setCurrChart} dataDoc={this.props.dataDoc} fieldKey={'data'} getAnchor={this.props.getAnchor} />;
- }
- return <div />;
- }
-}