diff --git a/src/main/java/com/google/sps/servlets/MapServlet.java b/src/main/java/com/google/sps/servlets/MapServlet.java
index 1677de2..b92f76e 100644
--- a/src/main/java/com/google/sps/servlets/MapServlet.java
+++ b/src/main/java/com/google/sps/servlets/MapServlet.java
@@ -41,6 +41,7 @@
 public class MapServlet extends HttpServlet {
 
   private final String TRIP_KEY_PARAM = "tripKey";
+  private final String DATE_PARAM = "date";
 
   /**
    * Checks for invalid cases (no user or tripKey).
@@ -73,8 +74,9 @@ public void doGet(HttpServletRequest request, HttpServletResponse response)
     } else { 
       Key tripKey = KeyFactory.stringToKey(stringTripKey);
 
+      String date = request.getParameter(DATE_PARAM);
       // Gets the locations from datastore and writes them to .../get-map
-      String result = doGetMap(response, datastore, userEntity, tripKey);
+      String result = doGetMap(response, datastore, userEntity, tripKey, date);
       response.getWriter().println(result);
     }
   }
@@ -83,7 +85,7 @@ public void doGet(HttpServletRequest request, HttpServletResponse response)
    * Gets the locations and returns them as a JSON string.
    */
   public String doGetMap(HttpServletResponse response, 
-      DatastoreService datastore, Entity userEntity, Key tripEntityKey) throws IOException {
+      DatastoreService datastore, Entity userEntity, Key tripEntityKey, String date) throws IOException {
   
     // Get trip Entity based on trip key.
     // Trip entity is needed to ensure that tripKey corresponds to a Trip under the current user.
@@ -100,9 +102,15 @@ public String doGetMap(HttpServletResponse response,
       return "No trip found";
     } 
 
-    // Get TripDay associated with the Trip.
-    // TODO(eshika): change to select the desired tripDay for multiday trips.
+    if (date == "" || date == null) {
+      date = (String) tripEntity.getProperty(Trip.START_DATE);
+    }
+
+    // Get TripDay associated with the Trip and inputted date.
+    Filter tripDayFilter =
+      new FilterPredicate(TripDay.DATE, FilterOperator.EQUAL, date);
     Query tripDayQuery = new Query(TripDay.QUERY_STRING, tripEntity.getKey());
+    tripDayQuery.setFilter(tripDayFilter);
     PreparedQuery tripDayResults = datastore.prepare(tripDayQuery);
     Entity tripDayEntity = tripDayResults.asSingleEntity();
 
diff --git a/src/main/webapp/maps.html b/src/main/webapp/maps.html
index ee2d32d..deebc98 100644
--- a/src/main/webapp/maps.html
+++ b/src/main/webapp/maps.html
@@ -47,6 +47,11 @@
           <button type="button" class="btn btn-primary btn-xlarge">Maps</button>
         </a>
       </div>
+      <h2>My Trip Map</h2>
+      <div id ="dateInput">
+          <label for="inputMapDate">Display Map for:</label>
+          <input type="date" class="form-control" name="inputMapDate" 
+                id="inputMapDate">
       <div id="routeMap"></div>
       <div id="rightPanel"></div>
     </div>
diff --git a/src/main/webapp/mapsScript.js b/src/main/webapp/mapsScript.js
index 6e0f3f2..3823910 100644
--- a/src/main/webapp/mapsScript.js
+++ b/src/main/webapp/mapsScript.js
@@ -47,16 +47,28 @@ window.initMap = function() {
   directionsRenderer.setMap(map);
   directionsRenderer.setPanel(document.getElementById('rightPanel'));
 
+  document.getElementById('inputMapDate').onchange = () => {
+    const date = document.getElementById('inputMapDate').value
+    if (date !== '') {
+      displayRouteOnMap(date);
+    }
+  };
+
   // Get locations from MapServlet and display directions on map.
-  displayRouteOnMap();
+  displayRouteOnMap('');
 }
 
 /*
  * Gets locations from MapServlet with the tripKey parameter.
  * Calls showDirections to show the directions with those locations.
  */
-function displayRouteOnMap() {
-  fetch('/get-map' + getTripKeyQuery()).then(response => response.json()).then((locations) => {
+function displayRouteOnMap(date) {
+  const urlParams = new URLSearchParams(window.location.search);
+  const tripKey = urlParams.get('tripKey');
+  const tripKeyQuery = (tripKey != null && tripKey != '') ? '?tripKey=' + tripKey : '';
+  const dateQuery = (date != null && date != '') ? '&date=' + date : '';
+  
+  fetch('/get-map' + tripKeyQuery + dateQuery).then(response => response.json()).then((locations) => {
     showDirections(locations);
   });
 }
diff --git a/src/main/webapp/style.css b/src/main/webapp/style.css
index 9f04ee9..c9a9f93 100644
--- a/src/main/webapp/style.css
+++ b/src/main/webapp/style.css
@@ -86,6 +86,15 @@
   text-align: center;
 }
 
+#inputMapDate {
+  width: 200px;
+  margin: auto;
+  margin-bottom: .75rem;
+}
+
+#dateInput {
+  width: 100%;
+
 #mapsTitle {
   margin-bottom: 10px;
 }
diff --git a/src/test/java/com/google/sps/MapServletTest.java b/src/test/java/com/google/sps/MapServletTest.java
index 0e917e6..03d2f10 100644
--- a/src/test/java/com/google/sps/MapServletTest.java
+++ b/src/test/java/com/google/sps/MapServletTest.java
@@ -203,7 +203,7 @@ public void testDoGetMap() throws Exception {
     datastore.put(yosemiteEntity);
 
     // run do Get
-    String result = mapServlet.doGetMap(response, datastore, userEntity, tripEntity.getKey());
+    String result = mapServlet.doGetMap(response, datastore, userEntity, tripEntity.getKey(), "");
 
     // even though DomeEntity is added first, its order property is 1 so it should appear 
     // after YosemiteEntity in the JSON.