diff options
Diffstat (limited to 'src')
4 files changed, 13 insertions, 11 deletions
diff --git a/src/client/views/nodes/DataVizBox/ChartBox.tsx b/src/client/views/nodes/DataVizBox/ChartBox.tsx index a2e4fd73c..34eee8ee8 100644 --- a/src/client/views/nodes/DataVizBox/ChartBox.tsx +++ b/src/client/views/nodes/DataVizBox/ChartBox.tsx @@ -1,8 +1,8 @@ import { observer } from 'mobx-react'; import * as React from 'react'; -import { Doc, HeightSym } from '../../../../fields/Doc'; +import { Doc } from '../../../../fields/Doc'; import { action, computed, observable } from 'mobx'; -import { Cast, NumCast, StrCast } from '../../../../fields/Types'; +import { NumCast, StrCast } from '../../../../fields/Types'; import { LineChart } from './components/LineChart'; import { Chart, ChartData } from './ChartInterface'; @@ -22,7 +22,7 @@ export interface DataPoint { @observer export class ChartBox extends React.Component<ChartBoxProps> { @observable private _chartData: ChartData | undefined = undefined; - @observable private currChart: LineChart | undefined; + private currChart: Chart | undefined; @computed get currView() { if (this.props.rootDoc._dataVizView) { @@ -39,8 +39,8 @@ export class ChartBox extends React.Component<ChartBoxProps> { } } - setCurrChart(chart: Chart | undefined) { - // this.currChart = chart; + setCurrChart(chart: Chart) { + this.currChart = chart; } @action diff --git a/src/client/views/nodes/DataVizBox/ChartInterface.ts b/src/client/views/nodes/DataVizBox/ChartInterface.ts index 6e37f966c..05ef35b95 100644 --- a/src/client/views/nodes/DataVizBox/ChartInterface.ts +++ b/src/client/views/nodes/DataVizBox/ChartInterface.ts @@ -7,6 +7,8 @@ export interface Chart { drawChart: () => void; height: number; width: number; + // TODO: nda - probably want to get rid of this to keep charts more generic + _getAnchor: () => Doc; } export interface ChartProps { diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx index 1d9b309ce..944468a43 100644 --- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx +++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx @@ -1,11 +1,11 @@ import { action, computed, observable } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; -import { Doc, FieldResult } from '../../../../fields/Doc'; -import { Cast, NumCast, StrCast } from '../../../../fields/Types'; +import { Doc } from '../../../../fields/Doc'; +import { Cast, StrCast } from '../../../../fields/Types'; import { CsvField } from '../../../../fields/URLField'; import { Docs } from '../../../documents/Documents'; -import { ViewBoxAnnotatableComponent, ViewBoxBaseComponent } from '../../DocComponent'; +import { ViewBoxAnnotatableComponent } from '../../DocComponent'; import { FieldViewProps, FieldView } from '../FieldView'; import { ChartBox } from './ChartBox'; import './DataVizBox.scss'; diff --git a/src/client/views/nodes/DataVizBox/components/LineChart.tsx b/src/client/views/nodes/DataVizBox/components/LineChart.tsx index 88598be3d..458ff5f23 100644 --- a/src/client/views/nodes/DataVizBox/components/LineChart.tsx +++ b/src/client/views/nodes/DataVizBox/components/LineChart.tsx @@ -62,7 +62,7 @@ export class LineChart extends React.Component<ChartProps> implements Chart { annotations => { // modify how d3 renders so that anything in this annotations list would be potentially highlighted in some way // could be blue colored to make it look like anchor - this.drawAnnotations(this.props.chartData.data[0][1].x, this.props.chartData.data[0][1].y); + this.drawAnnotations(this.props.chartData.data[0][4].x, this.props.chartData.data[0][4].y); }, { fireImmediately: true } ); @@ -78,7 +78,7 @@ export class LineChart extends React.Component<ChartProps> implements Chart { // loop through all html elements with class .circle-d1 and find the one that has "data-x" and "data-y" attributes that match the dataX and dataY // if it exists, then highlight it // if it doesn't exist, then remove the highlight - const elements = document.querySelectorAll('datapoint'); + const elements = document.querySelectorAll('.datapoint'); for (let i = 0; i < elements.length; i++) { const element = elements[i]; const x = element.getAttribute('data-x'); @@ -234,7 +234,7 @@ export class LineChart extends React.Component<ChartProps> implements Chart { this._x = d0.x; this._y = d0.y; // find .circle-d1 with data-x = d0.x and data-y = d0.y - const selected = svg.selectAll('.circle-d1').filter((d: any) => d['data-x'] === d0.x && d['data-y'] === d0.y); + const selected = svg.selectAll('.datapoint').filter((d: any) => d['data-x'] === d0.x && d['data-y'] === d0.y); this._currSelected = { x: d0.x, y: d0.y, elem: selected }; console.log('Getting here'); setTimeout(() => this.props.getAnchor()); |