* Adding presets

Signed-off-by: Christian Berger <christian.berger@gu.se>
chalmers-revere · Aug 26, 2018 · 3b79067 · 3b79067
1 parent a304f0b
commit 3b79067
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 9 deletions.
diff --git a/webapp/js/main.js b/webapp/js/main.js
@@ -889,6 +889,45 @@ function setupUI() {
 }
 
 ////////////////////////////////////////////////////////////////////////////////
+function gnuplot_selectPreset() {
+    const selection = document.getElementById('gnuplot-preset').value;
+    var plottingCode = "";
+    if ("gps-trace" == selection) {
+        plottingCode = `# Example for plotting opendlv_proxy_GeodeticWgs84Reading.0 as GPS trace using gnuplot.
+set terminal svg size 500,400 enhanced fname 'arial' fsize 5 solid
+set output 'out.svg'    # Output must always be named 'out.svg' to display.
+
+set title 'opendlv\_proxy\_GeodeticWgs84Reading.0'
+set xlabel 'Longitude'
+set ylabel 'Latitude'
+set key inside top left # Add legend box located at top/left.
+
+plot "opendlv_proxy_GeodeticWgs84Reading.0" using 2:1 title 'GPS trace' with lines
+`;
+    }
+    else if ("kiwi-distances" == selection) {
+        plottingCode = `# Example for plotting opendlv_proxy_DistanceReading.0 from Kiwi using gnuplot.
+set terminal svg size 500,400 enhanced fname 'arial' fsize 5 solid
+set output 'out.svg'    # Output must always be named 'out.svg' to display.
+
+set title 'opendlv\_proxy\_DistanceReading'
+set xlabel 't'
+set ylabel 'Distance [m]'
+set key inside top left # Add legend box located at top/left.
+
+plot "opendlv_proxy_DistanceReading.0" using 1 title 'US front' with lines, \
+     "opendlv_proxy_DistanceReading.2" using 1 title 'US rear' with lines
+`;
+    }
+
+    if ("" != plottingCode) {
+        document.getElementById("gnuplot-script").value = plottingCode;
+        if (!g_gnuplot.isRunning) {
+            gnuplot_runScript();
+        }
+    }
+}
+
 function plotSignals(val) {
     var plottingCode = "# Example for plotting " + val + " data using gnuplot.\n";
     plottingCode += `set terminal svg size 500,400 enhanced fname 'arial' fsize 5 solid
@@ -899,15 +938,14 @@ set output 'out.svg'    # Output must always be named 'out.svg' to display.
     plottingCode += "set title '" + val.replace(/_/g , "\\_") + "'\n";
     plottingCode += `set xlabel 'Value 1'    # Define label for x axis.
 set ylabel 'Value 2'    # Define label for y axis.
-set key inside top left # Add legend box located at top/left.;
+set key inside top left # Add legend box located at top/left.
 
 `;
     plottingCode += "# Plot first numerical signal of message '" + val + "'.\n";
     plottingCode += "# Replace 'using 1' with 'using 1:2' or similar to access other fields.\n\n";
     plottingCode += "# Actual call to plot data.\nplot \"" + val + "\" using 1 title 'Line 1' with lines\n";
 
     document.getElementById("gnuplot-script").value = plottingCode;
-
     if (!g_gnuplot.isRunning) {
         gnuplot_runScript();
     }

diff --git a/webapp/views/main.hbs b/webapp/views/main.hbs
@@ -30,11 +30,6 @@
     <link type="text/css" rel="stylesheet" href="css/maptalks.css"/>
 
     <style>
-    textarea {
-        font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
-        font-size:12px;
-    }
-
     .bg {
         background-image: url("background.jpg");
         height: 100%; 
@@ -353,12 +348,22 @@
                     <div class="tab-pane" id="panel-plot">
                         <div class="row">
                             <div class="col-md-12">
+                                <div class="row">
+                                    <div class="col-md-12">
+                                        Select pre-defined plot:
+                                        <select id="gnuplot-preset" onchange="gnuplot_selectPreset()">
+                                            <option value="none">&nbsp;</option>
+                                            <option value="gps-trace">GPS trace</option>
+                                            <option value="kiwi-distances">Distances from Kiwi platform</option>
+                                        </select>
+                                    </div>
+                                </div>
                                 <div class="row">
                                     <div class="col-md-6">
-                                        <textarea id="gnuplot-script" rows="20" cols="90" onkeyup="gnuplot_scriptChange()">
+                                        <textarea id="gnuplot-script" style="font-family:monospace;font-size:12px;" rows="20" cols="90" onkeyup="gnuplot_scriptChange()">
 # Click on the 'plot' button in the tab 'Messages' to add example code for plotting here.
                                         </textarea> <br>
-                                        <textarea id="gnuplot-output" rows="5" cols="90"></textarea>
+                                        <textarea id="gnuplot-output" style="font-family:monospace;font-size:12px;" rows="5" cols="90"></textarea>
                                     </div>
                                     <div class="col-md-6">
                                         <img src="" id="gnuplot-img" type="image/svg+xml" width=500 height=400 />