From fa5035385b00308b741af829e1891caaed14774e Mon Sep 17 00:00:00 2001
From: Dorian Goepp <dorian.goepp@gmail.com>
Date: Tue, 9 Apr 2019 16:09:19 +0200
Subject: [PATCH] A cool linechart of the involvement
---
src/LineChart/RosLineChart.js | 29 ++++++++++++++++-------------
src/devel-config.js | 6 ++++++
src/index.js | 2 +-
3 files changed, 23 insertions(+), 14 deletions(-)
diff --git a/src/LineChart/RosLineChart.js b/src/LineChart/RosLineChart.js
index c6c9514..2879cea 100644
--- a/src/LineChart/RosLineChart.js
+++ b/src/LineChart/RosLineChart.js
@@ -11,15 +11,14 @@ class RosLineChart extends Component {
this.state = {
data: {"" : []},
topic: {
- name: "/random/trace",
- messageType: "april_messages/trace",
+ name: "/predictions/interaction_involvement",
+ messageType: "april_messages/head_orientation_prediction",
fields: [
- "enacted.valence",
- "enacted.occurence",
+ "prediction_of_head_orientation.list[0].values[1]",
]
},
- // xLabel: "x label",
- // yLabel: "y label"
+ // xLabel: "Count",
+ yLabel: "Involvement",
};
}
@@ -42,6 +41,8 @@ class RosLineChart extends Component {
if (!(field in new_data)) {
new_data[field] = []
}
+ console.debug("Raw message: ", message);
+ console.debug("Selected field: ", property(field)(message));
new_data[field] = this.state.data[field].concat([{"y": property(field)(message)}])
})
return {
@@ -63,14 +64,16 @@ class RosLineChart extends Component {
render () {
const config = this.props.node.getConfig()
- if (config.displayMode === "readme") {
- return <p className="about">This <b>linechart</b> represents a <b>measure</b> evolving over time.</p>;
- }
+ if (config && 'displayMode' in config) {
+ if (config.displayMode === "readme") {
+ return <p className="about">This <b>linechart</b> represents a <b>measure</b> evolving over time.</p>;
+ }
- if (config.displayMode === "settings") {
- return <div>
- <p>config panel</p>
- </div>;
+ if (config.displayMode === "settings") {
+ return <div>
+ <p>config panel</p>
+ </div>;
+ }
}
return <SizedLineChart data={this.state.data} xLabel={this.state.xLabel} yLabel={this.state.yLabel} {...this.props}/>
diff --git a/src/devel-config.js b/src/devel-config.js
index 8cf17be..ee0d339 100644
--- a/src/devel-config.js
+++ b/src/devel-config.js
@@ -48,6 +48,7 @@ export const flexlayout_json = {
{
"type": "tabset",
"name": "Robot's memory",
+ "enableTabStrip": true,
"weight": 65,
"selected": 0,
"children": [
@@ -58,6 +59,11 @@ export const flexlayout_json = {
"hasReadme": true
},
},
+ {
+ "type": "tab",
+ "component": "line-chart",
+ "name": "involvement",
+ }
]
},
{
diff --git a/src/index.js b/src/index.js
index 62d7995..7c84e37 100644
--- a/src/index.js
+++ b/src/index.js
@@ -51,4 +51,4 @@ class Main extends React.Component {
}
}
-ReactDOM.render(<Main ros={false}/>, document.getElementById("container"));
\ No newline at end of file
+ReactDOM.render(<Main ros={true}/>, document.getElementById("container"));
\ No newline at end of file
--
GitLab