diff --git a/frontend/src/audio/ui/AudioPanel.vue b/frontend/src/audio/ui/AudioPanel.vue
index a1e40290ef25f2ac9028dae59b9bf08bf67d32f9..92b809533579061876c9fe6e96f646c27774430e 100644
--- a/frontend/src/audio/ui/AudioPanel.vue
+++ b/frontend/src/audio/ui/AudioPanel.vue
@@ -80,13 +80,14 @@ export default {
       },
       audioData: {},
       data: [],
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
     this.getOriginAudioData();
   },
   mounted() {
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -97,7 +98,7 @@ export default {
 
   watch: {
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     currentIndex: function(index) {
       if (this.data && this.data[index]) {
diff --git a/frontend/src/audio/ui/Config.vue b/frontend/src/audio/ui/Config.vue
index bc9511c7688f076c94b61f33193fd06b98de201a..0d931523d22a459b619af2f277f3255cebf1486e 100644
--- a/frontend/src/audio/ui/Config.vue
+++ b/frontend/src/audio/ui/Config.vue
@@ -20,6 +20,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -44,6 +45,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {
diff --git a/frontend/src/high-dimensional/HighDimensional.vue b/frontend/src/high-dimensional/HighDimensional.vue
index 431ddfebbd8e9b9d6fd525ab1423c17b99b3bb71..b89a3f3f835cf79bcc2db336714468a208145fe6 100644
--- a/frontend/src/high-dimensional/HighDimensional.vue
+++ b/frontend/src/high-dimensional/HighDimensional.vue
@@ -49,6 +49,7 @@ export default {
       },
       embeddingData: [],
       showLoading: false,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
@@ -61,7 +62,7 @@ export default {
       }
     });
 
-    if (this.config.running) {
+    if (this.config.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -79,7 +80,7 @@ export default {
       this.fetchDatasets();
     },
     'config.running': function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
   },
   mounted() {
diff --git a/frontend/src/high-dimensional/ui/Config.vue b/frontend/src/high-dimensional/ui/Config.vue
index b2dac0743f8ce6dfda658b814c8df3612682c73a..3fde71ce7073361751bcf50bc938152e34de1eda 100644
--- a/frontend/src/high-dimensional/ui/Config.vue
+++ b/frontend/src/high-dimensional/ui/Config.vue
@@ -54,6 +54,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -78,6 +79,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {
diff --git a/frontend/src/histogram/ui/Chart.vue b/frontend/src/histogram/ui/Chart.vue
index 878d718a1b6497ed683d1d31a52aec971d2d4150..4b7f5c446ed49d2f6cbdcd01de7b4bc33cc83d08 100644
--- a/frontend/src/histogram/ui/Chart.vue
+++ b/frontend/src/histogram/ui/Chart.vue
@@ -66,6 +66,7 @@ export default {
     return {
       originData: [],
       isExpand: false,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   watch: {
@@ -76,7 +77,7 @@ export default {
       this.initChartOption();
     },
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     isExpand: function(val) {
       this.expandArea(val);
@@ -85,7 +86,7 @@ export default {
   mounted() {
     let tagInfo = this.tagInfo;
     this.initChart(tagInfo);
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },
diff --git a/frontend/src/histogram/ui/Config.vue b/frontend/src/histogram/ui/Config.vue
index a28c74decef4aed0d1c3bde3328d2327aaa5c837..d31ab24e625f9a0d0bf33f87530a41c3ca0e800b 100644
--- a/frontend/src/histogram/ui/Config.vue
+++ b/frontend/src/histogram/ui/Config.vue
@@ -32,6 +32,7 @@
       class="visual-dl-page-run-toggle"
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       dark
       block
@@ -64,6 +65,7 @@ export default {
           value: 'offset',
         },
       ],
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {
diff --git a/frontend/src/images/ui/Config.vue b/frontend/src/images/ui/Config.vue
index 480b1c33d0aea19840d2d60735856de03a13a95a..4e7f220483262b9fa2b2666f91657322cb15c87a 100644
--- a/frontend/src/images/ui/Config.vue
+++ b/frontend/src/images/ui/Config.vue
@@ -25,6 +25,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -49,6 +50,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {
diff --git a/frontend/src/images/ui/Image.vue b/frontend/src/images/ui/Image.vue
index 9d998d55906b5c74072f712c66557669121842c8..0ced89ab9a863b1a1f205d7b4cb66e0501473a3d 100644
--- a/frontend/src/images/ui/Image.vue
+++ b/frontend/src/images/ui/Image.vue
@@ -93,13 +93,14 @@ export default {
       data: [],
       height: defaultImgHeight,
       weight: defaultImgWidth,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
     this.getOriginChartsData();
   },
   mounted() {
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -110,7 +111,7 @@ export default {
 
   watch: {
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     currentIndex: function(index) {
       /* eslint-disable fecs-camelcase */
diff --git a/frontend/src/scalars/ui/Config.vue b/frontend/src/scalars/ui/Config.vue
index c4a129fe9db7d11f3a9312ae907a9f9a32b531fa..340341dbd194cb867330ce00a62da896db85983f 100644
--- a/frontend/src/scalars/ui/Config.vue
+++ b/frontend/src/scalars/ui/Config.vue
@@ -64,11 +64,11 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
       block
-      v-if="!isDemo"
     >
       {{ config.running ? 'Running' : 'Stopped' }}
     </v-btn>
diff --git a/frontend/src/texts/ui/Config.vue b/frontend/src/texts/ui/Config.vue
index a18843359398af68ca33080c737872608986a23c..d8aca8ef59fdc3a66457b9d161a7716fdba58f94 100644
--- a/frontend/src/texts/ui/Config.vue
+++ b/frontend/src/texts/ui/Config.vue
@@ -22,6 +22,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -46,6 +47,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {