style maps

Author: randyrollog

app/assets/stylesheets/custom.css.scss

@@ -381,7 +381,6 @@ $maincolor: #333;
 	#friend_name {
 		color: white;
 		font-weight: bolder;
-		// border-bottom: 2px dashed white;
 	}
 
 	#namer {

app/views/meet_requests/show.html.erb

@@ -8,8 +8,6 @@
           geocoder,
           markersArray = [],
           directionsDisplay,
-          polyline=[],
-          businessesArray=[],
           infowindow;
 
       function initialize() {
@@ -145,10 +143,10 @@
                     console.log(midpoint);
                     console.log(response.routes[0].legs[0].steps[0]);
 
-                    var midMarker = new google.maps.Marker({
-                      position: midpoint,
-                      map: map,
-                    });
+                    // var midMarker = new google.maps.Marker({
+                    //   position: midpoint,
+                    //   map: map,
+                    // });
 
                     var request = {
                       location: midpoint,
@@ -184,11 +182,20 @@
         }
       }
 
+      var placeMarkers = new google.maps.MarkerImage(
+        '/assets/orange_marker.png',
+        null, // size
+        null, // origin
+        new google.maps.Point( 10, 28 ), // anchor (move to center of marker)
+        new google.maps.Size( 20, 28 ) // scaled size (required for Retina display icon)
+      );
+
       function createMarker(place) {
         var placeLoc = place.geometry.location;
         var marker = new google.maps.Marker({
           map: map,
-          position: place.geometry.location
+          position: place.geometry.location,
+          icon: placeMarkers
         });
 
         google.maps.event.addListener(marker, 'click', function() {

app/views/users/show.html.erb

@@ -22,11 +22,35 @@
                 { saturation: -20 }
               ]
             },{
-              featureType: "road.local",
+              featureType: "road",
               elementType: "geometry",
               stylers: [
-                { hue: "#00ffee" },
-                { saturation: 50 }
+                { color: "#e2cfbc" },
+              ]
+            },{
+              featureType: "road.arterial",
+              elementType: "all",
+              stylers: [
+              { visibility: "off" }
+              ]
+            },{
+              featureType: "administrative.neighborhood",
+              elementType: "all",
+              stylers: [
+                // { color: "#ffffff" },
+              ]
+            },{
+              featureType: "road.local",
+              elementType: "all",
+              stylers: [
+                { visibility: "off" }
+              ]
+            },{
+              featureType: "landscape",
+              elementType: "all",
+              stylers: [
+                { visibility: "off" },
+                { color: "#ffffff" },
               ]
             },{
               featureType: "road",
@@ -105,7 +129,7 @@
                 '/assets/orange_marker.png',
                 null, // size
                 null, // origin
-                new google.maps.Point( 8, 8 ), // anchor (move to center of marker)
+                new google.maps.Point( 10, 28 ), // anchor (move to center of marker)
                 new google.maps.Size( 20, 28 ) // scaled size (required for Retina display icon)
               );
 
@@ -131,7 +155,7 @@
     google.maps.event.addDomListener(window, "load", initialize);
 
   </script>
-  <section id="map-wrapper">
+  <section id="map-wrapper">      
     <article></article>
     <div id="bottom_nav">
       <%= link_to "", meet_requests_path, class: "glyphicon glyphicon-th" %>