diff --git a/src/pages/MapPage.vue b/src/pages/MapPage.vue
index 4330684..e01b274 100644
--- a/src/pages/MapPage.vue
+++ b/src/pages/MapPage.vue
@@ -23,6 +23,10 @@
       </div>
       <div id="prefHeader">TRAINS</div>
       <div class="container-fluid" @change="decideShowTrains();">
+        <div class="form-check form-switch">
+          <input @change="selectAllTrains();" class="form-check-input" type="checkbox" role="switch" id="showAllTrains" v-model="showAllTrains"/>
+          <label class="form-check-label" for="showAllTrains">Select All Trains</label>
+        </div>
         <div class="form-check form-switch">
           <input class="form-check-input" type="checkbox" role="switch" id="showMainland" v-model="showMainland"/>
           <label class="form-check-label" for="showMainland">Mainline Trains</label>
@@ -164,6 +168,7 @@ export default {
           showAllStations: true,
           showMainlandStations: true, 
           showDARTStations: true,
+          showAllTrains: true,
           showLate: true,
           showOnTime: true,
           showMainland: true,
@@ -300,6 +305,17 @@ export default {
             this.showMainlandStations = this.showAllStations;
         },
 
+        // method to select all trains 
+        selectAllTrains() {
+          this.showLate = this.showAllTrains; 
+          this.showOnTime = this.showAllTrains;
+          this.showMainland = this.showAllTrains;
+          this.showDART = this.showAllTrains;
+          this.showRunning = this.showAllTrains;
+          this.showTerminated = this.showAllTrains;
+          this.showNotYetRunning = this.showAllTrains;
+        },
+
         // method to display a selected train
         getSelectedTrain(i) {
           store.setSelectedTrain(this.allTrains[i]);