WordPress.org

Ready to get started?Download WordPress

Forums

WP Google Maps
[resolved] How to set up a styled map ? (8 posts)

  1. Pauloscorps
    Member
    Posted 9 months ago #

    Hi,

    First, thank you for this helpful plugin.
    I'm trying to customize my map with GoogleMaps API :
    http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html

    Unfortunately, I don't know where to put the generated code in the php class.

    Could you tell me where to paste these lines ?

    Thanks in advance.

    http://wordpress.org/plugins/wp-google-maps/

  2. WPGMaps
    Member
    Plugin Author

    Posted 9 months ago #

    Hi Pauloscorps
    Sure thing :)

    Open wp-google-maps.php
    on line 722, add a new line and add this:

    var WPGMZA_STYLING = new google.maps.StyledMapType('JSON GOES HERE',{name: "WPGMZA STYLING"});
    this.map.mapTypes.set('WPGMZA STYLING', WPGMZA_STYLING);
    this.map.setMapTypeId('WPGMZA STYLING');

    So the section should look like this:

    this.map = new google.maps.Map(jQuery(selector)[0], myOptions);
     this.bounds = new google.maps.LatLngBounds();
     google.maps.event.addListener(MYMAP.map, 'click', function() {
       infoWindow.close();
     });
    
     var WPGMZA_STYLING = new google.maps.StyledMapType('JSON GOES HERE',{name: "WPGMZA STYLING"});
     this.map.mapTypes.set('WPGMZA STYLING', WPGMZA_STYLING);
     this.map.setMapTypeId('WPGMZA STYLING');
    }

    Does that help?

    Kind regards
    Nick

  3. Pauloscorps
    Member
    Posted 9 months ago #

    Hi,

    Thank you for your answer.
    Unfortunately, I tried your code but it doesn't seem to work.

    I opened the file "wpGoogleMaps.php" (I don't have the file wp-google-maps.php in the plugin folder), and found the lines you mentioned.

    Here is the final code :

    var WPGMZA_STYLING = new google.maps.StyledMapType(
                        [{
                            "stylers": [
                              { "gamma": 1.18 },
                              { "hue": "#ff0000" },
                              { "saturation": -38 },
                              { "lightness": -38 }
                            ]
                        }], {name: "WPGMZA STYLING"});
                    this.map.mapTypes.set('WPGMZA STYLING', WPGMZA_STYLING);
                    this.map.setMapTypeId('WPGMZA STYLING');

    I set hue to red to make the result visible, but the map always appears with its default style.

    Could you tell what I did wrong ?

  4. WPGMaps
    Member
    Plugin Author

    Posted 9 months ago #

    Hi
    That's perfect.
    The effect will only show up on the front end and not on the back end.
    Please confirm that your map is now styled on the front end?

  5. Pauloscorps
    Member
    Posted 9 months ago #

    The map is not styled in the front end either.
    I fully cleaned my browser's cache and the result is still the same. Nothing.

  6. WPGMaps
    Member
    Plugin Author

    Posted 9 months ago #

    Please put a link to the map here

  7. Pauloscorps
    Member
    Posted 9 months ago #

    I can't put the site here because it's not in production and htpasswd protected. I send you the access from your website's "Contact Us" section.

  8. Pauloscorps
    Member
    Posted 9 months ago #

    Problem resolved using the Gold extension.
    Thank's a lot for the great support and the plugin.

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.