diff --git a/src/components/widget-plot-table.js b/src/components/widget-plot-table.js
index 734b051..0905ba9 100644
--- a/src/components/widget-plot-table.js
+++ b/src/components/widget-plot-table.js
@@ -160,7 +160,8 @@ class WidgetPlotTable extends Component {
// Make tick count proportional to the plot width using a rough scale ratio
var tickCount = Math.round(this.state.size.w / 80);
-
+ var colorScale = scaleOrdinal(schemeCategory10);
+
return (
{this.props.widget.name}
@@ -190,11 +191,14 @@ class WidgetPlotTable extends Component {
domain={{ x: [this.state.firstTimestamp, this.state.latestTimestamp] }}
/>
}
-
- {
- this.state.signals.map((signal) =>
- ({signal} + ',')
- )
+
+ {
+ this.state.preselectedSignals.reduce( (accum, signal, i) => {
+ if (this.state.signals.includes(signal.index)) {
+ accum.push(
{signal.name}
)
+ }
+ return accum;
+ }, [])
}
diff --git a/src/styles/widgets.css b/src/styles/widgets.css
index e43c7ef..90bee10 100644
--- a/src/styles/widgets.css
+++ b/src/styles/widgets.css
@@ -119,12 +119,36 @@
}
.plot-table-widget .checkbox label {
+ height: 100%;
+ width: 100%;
+ padding: 6px 12px;
+}
+
+.plot-table-widget .btn {
padding: 0px;
}
.plot-table-widget input[type="checkbox"] {
display: none;
}
+
+.plot-table-widget .plot-legend {
+ display: -webkit-flex;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-around;
+}
+
+.plot-table-widget .signal-legend {
+ font-size: 0.8em;
+ font-weight: 700;
+}
+
+.plot-table-widget .legend-color {
+ height: 50%;
+ display: inline-block;
+ vertical-align: middle;
+}
/* End PlotTable Widget */
/* Reset Bootstrap styles to "disable" while editing */