1 files changed, 12 insertions, 2 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/Histogram.tsx b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
index c9cd49aa1..479f6584c 100644
--- a/src/client/views/nodes/DataVizBox/components/Histogram.tsx
+++ b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
@@ -66,6 +66,14 @@ export class Histogram extends React.Component<HistogramProps> {
             .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(){
+        var ax0 = this.props.axes[0];
+        var ax1 = (this.props.axes.length>1)? this.props.axes[1] : undefined;
+        if (this.props.axes.length<2 || !/\d/.test(this.props.pairs[0][ax0]) || !ax1){
+            return ax0 + " Histogram";
+        }
+        else return ax1 + " by " + ax0 + " Histogram";
+    }    
     @computed get incomingLinks() {
         return LinkManager.Instance.getAllRelatedLinks(this.props.rootDoc) // out of all links
             .filter(link => {
@@ -416,8 +424,10 @@ export class Histogram extends React.Component<HistogramProps> {
         else selected = 'none';
         return (
             this.props.axes.length >= 1 ? (
-            <div ref={this._histogramRef} className="chart-container">
-                <span className={'selected-data'}> {`Selected: ${selected}`}</span>
+            <div className="chart-container" >
+                <div className="graph-title"> {this.graphTitle} </div>
+                <div className={'selected-data'}> {`Selected: ${selected}`}</div>
+                <div ref={this._histogramRef} />
             </div>
             ) : <span className="chart-container"> {'first use table view to select a column to graph'}</span>
         );