Build in production mode

package.json

@@ -59,7 +59,7 @@
     "node-bourbon": "^4.2.3",
     "node-sass": "^4.9.2",
     "painterro": "^0.2.65",
-    "plotly.js-dist": "^1.54.1",
+    "plotly.js": "^1.54.1",
     "printj": "^1.2.1",
     "raw-loader": "^0.5.1",
     "request": "^2.69.0",
@@ -86,7 +86,7 @@
     "build:watch": "webpack --watch",
     "test": "cross-env NODE_OPTIONS=\"--max-old-space-size=4096\" karma start --single-run",
     "test:debug": "cross-env NODE_ENV=debug karma start --no-single-run",
-    "test:coverage": "cross-env NODE_ENV=production; cross-env COVERAGE=true node --max-old-space-size=4096 node_modules/karma-cli/bin/karma start --single-run",
+    "test:coverage": "cross-env NODE_ENV=production COVERAGE=true NODE_OPTIONS=\"--max-old-space-size=4096\" karma start --single-run",
     "test:watch": "karma start --no-single-run",
     "verify": "concurrently 'npm:test' 'npm:lint'",
     "jsdoc": "jsdoc -c jsdoc.json -R API.md -r -d dist/docs/api",

src/MCT.js

@@ -252,7 +252,6 @@ define([
         // Plugins that are installed by default
 
         this.install(this.plugins.Plot());
-        this.install(this.plugins.PlotlyPlot());
         this.install(this.plugins.TelemetryTable());
         this.install(PreviewPlugin.default());
         this.install(LegacyIndicatorsPlugin());

src/plugins/plotlyPlot/components/PlotlyViewLayout.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script>
-import Plotly from 'plotly.js-dist';
+import Plotly from 'plotly.js/dist/plotly.min.js';
 import moment from 'moment'
 
 export default {
@@ -36,7 +36,7 @@ export default {
     methods: {
         changeClock() {
             if (this.openmct.time.clock()) {
-                Plotly.purge(this.plotElement);
+                //Plotly.purge(this.plotElement);
                 this.telemetryObjects.forEach((telemetryObject, index) => {
                     this.subscribeTo(telemetryObject, index);
                 });
@@ -130,9 +130,9 @@ export default {
             this.unsubscribe(keyString);
             this.telemetryObjects = this.telemetryObjects.filter(object => !(identifier.key === object.identifier.key));
             if (!this.telemetryObjects.length) {
-                Plotly.purge(this.plotElement);
+                //Plotly.purge(this.plotElement);
             } else {
-                Plotly.deleteTraces(this.plotElement, this.telemetryObjects.length - 1);
+                //Plotly.deleteTraces(this.plotElement, this.telemetryObjects.length - 1);
             }
         },
         getYAxisLabel(telemetryObject) {
@@ -190,36 +190,36 @@ export default {
             this.plotData[telemetryObject.identifier.key] = traceData[0];
 
             if (!this.plotElement.childNodes.length) { // not traces yet, so create new plot
-                Plotly.newPlot(
+                // Plotly.newPlot(
-                    this.plotElement,
+                //     this.plotElement,
-                    traceData,
+                //     traceData,
-                    this.getLayout(telemetryObject, true),
+                //     this.getLayout(telemetryObject, true),
-                    {
+                //     {
-                        displayModeBar: false, // turns off hover-activated toolbar
+                //         displayModeBar: false, // turns off hover-activated toolbar
-                        staticPlot: true // turns off hover effects on datapoints
+                //         staticPlot: true // turns off hover effects on datapoints
-                    }
+                //     }
-                );
+                // );
             } else {
-                if (isAdd) { // add a new trace to existing plot
+                // if (isAdd) { // add a new trace to existing plot
-                    Plotly.addTraces(this.plotElement, traceData);
+                //     Plotly.addTraces(this.plotElement, traceData);
-                } else { // update existing trace with new data (bounds change)
+                // } else { // update existing trace with new data (bounds change)
-                    Plotly.react(this.plotElement, Object.values(this.plotData), this.getLayout(telemetryObject, false));
+                //     Plotly.react(this.plotElement, Object.values(this.plotData), this.getLayout(telemetryObject, false));
-                    this.updatePlotRange();
+                //     this.updatePlotRange();
-                }
+                // }
             }
         },
         updateData(datum, index) {
             // plot all datapoints within bounds
             if (datum.utc <= this.bounds.end) {
 
-                Plotly.extendTraces(
+                // Plotly.extendTraces(
-                    this.plotElement,
+                //     this.plotElement,
-                    {
+                //     {
-                        x: [[this.formatDatumX(datum)]],
+                //         x: [[this.formatDatumX(datum)]],
-                        y: [[this.formatDatumY(datum)]]
+                //         y: [[this.formatDatumY(datum)]]
-                    },
+                //     },
-                    [index]
+                //     [index]
-                );
+                // );
                 this.updatePlotRange();
             }
         },
@@ -230,7 +230,7 @@ export default {
                     this.formatDatumX({utc: this.bounds.end})
                 ]
             };
-            Plotly.relayout(this.plotElement, newRange);
+//            Plotly.relayout(this.plotElement, newRange);
         }
     }
 }

src/plugins/plotlyPlot/components/plotly.scss

@@ -1,3 +0,0 @@
-.plot svg {
-}
-

src/styles/vue-styles.scss

@@ -18,7 +18,6 @@
 @import "../plugins/folderView/components/list-item.scss";
 @import "../plugins/folderView/components/list-view.scss";
 @import "../plugins/imagery/components/imagery-view-layout.scss";
-@import "../plugins/plotlyPlot/components/plotly.scss";
 @import "../plugins/telemetryTable/components/table-row.scss";
 @import "../plugins/telemetryTable/components/telemetry-filter-indicator.scss";
 @import "../plugins/tabs/components/tabs.scss";