aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DataVizBox/components/LineChart.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/DataVizBox/components/LineChart.tsx')
-rw-r--r--src/client/views/nodes/DataVizBox/components/LineChart.tsx11
1 files changed, 9 insertions, 2 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/LineChart.tsx b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
index 91baf095d..da79df476 100644
--- a/src/client/views/nodes/DataVizBox/components/LineChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
@@ -53,6 +53,9 @@ export class LineChart extends React.Component<LineChartProps> {
.map(pair => ({ x: Number(pair[this.props.axes[0]]), y: Number(pair[this.props.axes[1]]) }))
.sort((a, b) => (a.x < b.x ? -1 : 1));
}
+ @computed get graphTitle(){
+ return this.props.axes[1] + " vs. " + this.props.axes[0] + " Line Chart";
+ }
@computed get incomingLinks() {
return LinkManager.Instance.getAllRelatedLinks(this.props.rootDoc) // out of all links
.filter(link => {
@@ -338,9 +341,13 @@ export class LineChart extends React.Component<LineChartProps> {
render() {
const selectedPt = this._currSelected ? `x: ${this._currSelected.x} y: ${this._currSelected.y}` : 'none';
return (
- <div ref={this._lineChartRef} className="chart-container">
- <span className={'selected-data'}> {this.props.axes.length < 2 ? 'first use table view to select two axes to plot' : `Selected: ${selectedPt}`}</span>
+ this.props.axes.length >= 2 ? (
+ <div className="chart-container" >
+ <div className="graph-title"> {this.graphTitle} </div>
+ <div className={'selected-data'}> {`Selected: ${selectedPt}`}</div>
+ <div ref={this._lineChartRef} />
</div>
+ ) : <span className="chart-container"> {'first use table view to select two axes to plot'}</span>
);
}
}