I found a code snippet on http://www.41latitude.com/post/1268734799/google-styled-maps:
[ { featureType: "administrative", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "poi", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "water", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "road", elementType: "labels", stylers: [ { visibility: "off" } ] } ]
I should be able to use it in my maps, but is there somebody who can tell me how I can use this snippet? I can't find anything about it in the API of Google Maps V3.
Click the "Labels" option to turn off labels on the map. All streets, cities and geographic labels will be removed from the map.
Thank you for getting back to us on this. To hide the Marker Category item, you will need to go to Maps->Settings->Marker Listing and then if you look in the options you will see the option to – Hide the Category column.
Step 1 Go to Add or Edit Map and Scroll down to the 'Infowindow Settings' section. Step 2 Enable the box of 'Hide Markers on Page Load' option. Step 3 Click on Save Map and open it in browser.
Once you are able to detect the marker click event you need to "hide" or remove the marker from the map. The standard way for doing this with google maps is to do this: this. setMap(null);
As @ceejayoz suggested in the other answer, you are trying to use the new Styled Map features of the v3 Maps API. Here's a very basic example of how you could use the above style in a simple map:
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Google Maps Dark Water Style Demo</title> <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> </head> <body> <div id="map" style="width: 550px; height: 300px;"></div> <script type="text/javascript"> var myStyle = [ { featureType: "administrative", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "poi", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "water", elementType: "labels", stylers: [ { visibility: "off" } ] },{ featureType: "road", elementType: "labels", stylers: [ { visibility: "off" } ] } ]; var map = new google.maps.Map(document.getElementById('map'), { mapTypeControlOptions: { mapTypeIds: ['mystyle', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.TERRAIN] }, center: new google.maps.LatLng(30, 0), zoom: 3, mapTypeId: 'mystyle' }); map.mapTypes.set('mystyle', new google.maps.StyledMapType(myStyle, { name: 'My Style' })); </script> </body> </html>
Screenshot:
You may also want to check out the Google Maps APIs Styling Wizard which will allow you to graphically edit styles.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With