diff --git a/src/components/durationjs.vue b/src/components/durationjs.vue
index 2abbfdd..75ace14 100644
--- a/src/components/durationjs.vue
+++ b/src/components/durationjs.vue
@@ -132,7 +132,7 @@ export default {
     inputTimeFields: {
       get() {
         let paddedTimeFields = [];
-        this.inputTypes.map(inputTypeUnit => {
+        this.inputTypes.forEach(inputTypeUnit => {
           // Pad the dd/hh/mm/ss field string to 2 digits and add it to the list
           paddedTimeFields.push(this.tUnits[inputTypeUnit].val.toString().padStart(2, '0'));
         });
diff --git a/src/module/cytoscapeMap.js b/src/module/cytoscapeMap.js
index 49ec9c7..87d8806 100644
--- a/src/module/cytoscapeMap.js
+++ b/src/module/cytoscapeMap.js
@@ -280,7 +280,7 @@ export default function cytoscapeMap(mapData, dataLayerType, dataLayerOption, cu
     }
     //存下此刻剛進入畫面時當前所有節點的座標位置
     const allNodes = cy.nodes();
-    allNodes.map(nodeFirstlySave => {
+    allNodes.forEach(nodeFirstlySave => {
       cytoscapeStore.saveNodePosition(nodeFirstlySave.id(), nodeFirstlySave.position(), rank);
     });
 
diff --git a/src/stores/allMapData.js b/src/stores/allMapData.js
index 97f18d5..5192b2a 100644
--- a/src/stores/allMapData.js
+++ b/src/stores/allMapData.js
@@ -97,7 +97,7 @@ export default defineStore('allMapDataStore', {
     },
     filterAttrs: state => {
       if(state.allFilterAttrs !== null){
-        state.allFilterAttrs.map(att => {
+        state.allFilterAttrs.forEach(att => {
           switch (att.type) {
             case 'date':
               att.min = att.min !== null ? moment(att.min).format('YYYY/MM/DD HH:mm') : null;
@@ -193,10 +193,10 @@ export default defineStore('allMapDataStore', {
         const response = await this.$axios.get(api);
         this.allTraceTaskSeq = response.data.task_seq;
         this.allCase = response.data.cases;
-        this.allCase.map(c => {
+        this.allCase.forEach(c => {
           c.started_at = moment(c.started_at).format('YYYY/MM/DD HH:mm');
           c.completed_at = moment(c.completed_at).format('YYYY/MM/DD HH:mm');
-          c.attributes.map(att => {
+          c.attributes.forEach(att => {
             switch (att.type) {
               case 'date':
                 att.value = att.value !== null ? moment(att.value).format('YYYY/MM/DD HH:mm') : null;
@@ -232,10 +232,10 @@ export default defineStore('allMapDataStore', {
         const response = await this.$axios.get(api);
         this.allBaseTraceTaskSeq = response.data.task_seq;
         this.allBaseCase = response.data.cases;
-        this.allBaseCase.map(c => {
+        this.allBaseCase.forEach(c => {
           c.started_at = moment(c.started_at).format('YYYY/MM/DD HH:mm');
           c.completed_at = moment(c.completed_at).format('YYYY/MM/DD HH:mm');
-          c.attributes.map(att => {
+          c.attributes.forEach(att => {
             switch (att.type) {
               case 'date':
                 att.value = att.value !== null ? moment(att.value).format('YYYY/MM/DD HH:mm') : null;
diff --git a/src/stores/conformance.js b/src/stores/conformance.js
index 6c36e75..720c403 100644
--- a/src/stores/conformance.js
+++ b/src/stores/conformance.js
@@ -123,7 +123,7 @@ export default defineStore('conformanceStore', {
         const newData = state.allCases.map(c => {
           c.started_at = moment(c.started_at).format('YYYY/MM/DD HH:mm');
           c.completed_at = moment(c.completed_at).format('YYYY/MM/DD HH:mm');
-          c.facets.map(fac => {
+          c.facets.forEach(fac => {
             switch(fac.type) {
               case 'dummy': //sonar-qube
               case 'duration-list':
@@ -135,7 +135,7 @@ export default defineStore('conformanceStore', {
             };
             return fac;
           });
-          c.attributes.map(att => {
+          c.attributes.forEach(att => {
             switch (att.type) {
               case 'date':
                 att.value = att.value !== null ? moment(att.value).format('YYYY/MM/DD HH:MM:ss') : null;
@@ -165,7 +165,7 @@ export default defineStore('conformanceStore', {
         const newData = state.allLoopCases.map(c => {
           c.started_at = moment(c.started_at).format('YYYY/MM/DD HH:mm');
           c.completed_at = moment(c.completed_at).format('YYYY/MM/DD HH:mm');
-          c.attributes.map(att => {
+          c.attributes.forEach(att => {
             switch (att.type) {
               case 'date':
                 att.value = att.value !== null ? moment(att.value).format('YYYY/MM/DD HH:mm:ss') : null;
diff --git a/src/stores/files.js b/src/stores/files.js
index 0173297..20df087 100644
--- a/src/stores/files.js
+++ b/src/stores/files.js
@@ -69,7 +69,7 @@ export default defineStore('filesStore', {
         const response = await axios.get(api);
 
         this.allEventFiles = response.data;
-        this.allEventFiles.map(o => {
+        this.allEventFiles.forEach(o => {
           switch (o.type) {
             case 'log':
               icon = 'work_history';
diff --git a/src/stores/mapPathStore.ts b/src/stores/mapPathStore.ts
index 4229537..915af95 100644
--- a/src/stores/mapPathStore.ts
+++ b/src/stores/mapPathStore.ts
@@ -266,10 +266,10 @@ export default defineStore('useMapPathStore', {
     },
     async highlightMostFrequentPath() {
       const LIST_INDEX = 0;
-      this.insightWithPath['most_freq_traces'][LIST_INDEX].nodes.map(nodeToHighlight => {
+      this.insightWithPath['most_freq_traces'][LIST_INDEX].nodes.forEach(nodeToHighlight => {
         nodeToHighlight.data('nodeImageUrl', ImgCapsulesGlow[nodeToHighlight.data('level')]);
       });
-      this.insightWithPath['most_freq_traces'][LIST_INDEX].edges.map(edgeToHighlight =>
+      this.insightWithPath['most_freq_traces'][LIST_INDEX].edges.forEach(edgeToHighlight =>
         edgeToHighlight.addClass('highlight-edge'));
     },
     async highlightMostFrequentPathUnused() {
diff --git a/src/views/Compare/MapCompare.vue b/src/views/Compare/MapCompare.vue
index e5446d2..e96d761 100644
--- a/src/views/Compare/MapCompare.vue
+++ b/src/views/Compare/MapCompare.vue
@@ -384,7 +384,7 @@
         };
   
         mapData.edges = [];
-        this[mapType].edges.map(edge => {
+        this[mapType].edges.forEach(edge => {
           mapData.edges.push({
             data: {
               source:edge.tail,
@@ -426,7 +426,7 @@
         // 找出 type activity's node
         const activityNodeArray = nodes.filter(node => node.data.type === 'activity');
         // 找出除了 start, end 以外所有的 node 的 option value
-        activityNodeArray.map(node => nodeOptionArr.push(node.data[this.dataLayerType][this.dataLayerOption]));
+        activityNodeArray.forEach(node => nodeOptionArr.push(node.data[this.dataLayerType][this.dataLayerOption]));
         // 將node的option值從小到大排序(映對色階淺到深)
         nodeOptionArr = nodeOptionArr.sort((a, b) => a - b);
         for(let i = 0; i < ImgCapsules.length; i++) {
@@ -435,10 +435,10 @@
           leveledGroups.push(nodeOptionArr.slice(startIdx, endIdx));
         }
         for(let level = 0; level < leveledGroups.length; level++) {
-          leveledGroups[level].map(option => {
+          leveledGroups[level].forEach(option => {
             // 考慮可能有名次一樣的情形
             const curNodes = activityNodeArray.filter(activityNode => activityNode.data[this.dataLayerType][this.dataLayerOption] === option);
-            curNodes.map(curNode => {
+            curNodes.forEach(curNode => {
                 curNode.data = {
                 ...curNode.data,
                 nodeImageUrl: ImgCapsules[level],
diff --git a/src/views/Discover/Map/Map.vue b/src/views/Discover/Map/Map.vue
index 470d1d6..903986f 100644
--- a/src/views/Discover/Map/Map.vue
+++ b/src/views/Discover/Map/Map.vue
@@ -401,7 +401,7 @@ export default {
       };
 
       mapData.edges = [];
-      this[mapType].edges.map(edge => {
+      this[mapType].edges.forEach(edge => {
         mapData.edges.push({
           data: {
             source: edge.tail,
@@ -444,7 +444,7 @@ export default {
       // 找出 type activity's node
       const activityNodeArray = nodes.filter(node => node.data.type === 'activity');
       // 找出除了 start, end 以外所有的 node 的 option value
-      activityNodeArray.map(node => nodeOptionArr.push(node.data[this.dataLayerType][this.dataLayerOption]));
+      activityNodeArray.forEach(node => nodeOptionArr.push(node.data[this.dataLayerType][this.dataLayerOption]));
       // 將node的option值從小到大排序(映對色階淺到深)
       nodeOptionArr = nodeOptionArr.sort((a, b) => a - b);
       for (let i = 0; i < ImgCapsules.length; i++) {
@@ -453,10 +453,10 @@ export default {
         leveledGroups.push(nodeOptionArr.slice(startIdx, endIdx));
       }
       for (let level = 0; level < leveledGroups.length; level++) {
-        leveledGroups[level].map(option => {
+        leveledGroups[level].forEach(option => {
           // 考慮可能有名次一樣的情形
           const curNodes = activityNodeArray.filter(activityNode => activityNode.data[this.dataLayerType][this.dataLayerOption] === option);
-          curNodes.map(curNode => {
+          curNodes.forEach(curNode => {
             curNode.data = {
               ...curNode.data,
               nodeImageUrl: ImgCapsules[level],