change zoom level of marker

New home Forums Pro Add-on General queries change zoom level of marker

Tagged: ,

This topic contains 36 replies, has 7 voices, and was last updated by  sawmri 6 months ago.

Viewing 15 posts - 1 through 15 (of 38 total)
  • Author
    Posts
  • #23799

    amandsim
    Member

    Hi,

    I would like to be able to change the zoom level when I click one of the markers. Currently it’s to close and I need it to show more area.

    Is it possible to do that? I don’t mind modifying the code if necessary.

    Thanks!

    #23814

    Dylan
    Moderator

    Hi there,

    Thank you so much for getting in touch with us.

    Are you referring to the zoom level set when you click on a marker listing below the map?

    If so, yes it is possible to change the zoom level within the code.

    If you are however talking about the zoom level when a marker is clicked within the map, we do not set the zoom level by default. Meaning there may be something else going on with the map causing it to zoom. If this is the case, please send me a link to your map so that I can run a few tests from my side?

    #23815

    amandsim
    Member

    Hi dylan,

    Yes, what i’m trying to do is to change the zoom level when a marker is clicked from the marker listing.

    Could you please let me know which code should i modify and how to change the zoom level?

    Thanks!

    #23831

    Dylan
    Moderator

    Hi there,

    Not a problem at all. Please follow the steps below to make this change:

    1. Open the core.js file (wp-google-maps-pro/js/core.js) and look for the following segment of code:

    if (click_from_list) {
       MYMAP[map_id].map.panTo(marker.position);
       MYMAP[map_id].map.setZoom(13);
    }
    click_from_list = false;

    2. There will be more than on instance of the code above (the second instance will be relatively close to the first and should be easy to fine) – I would suggest looking at lines 2756 to 2779 Approx.
    3. Within all instances of this code, you will need to alter the following line of code:

    MYMAP[map_id].map.setZoom(13);

    Where 13 is the zoom level
    4. Once this is done, remember to save the file.

    I hope this helps?

    #30701

    Hi Dylan.

    I’ve tried changing the zoom level to 20 on both of them but nothing changed.

    #30716

    [quote quote=30701]Hi Dylan.

    I’ve tried changing the zoom level to 20 on both of them but nothing changed.

    [/quote]

    ** Sorry, but it somehow worked now. Thank you!

    #30752

    Dylan
    Moderator
    This reply has been marked as private.
    #31308

    aforshaw
    Member

    Hi – I have exactly the same problem, but clicking on a marker (as opposed to one from the list below the map) will not zoom in and pan.

    Where do I need to change in order to zoom the map when clicking on a marker? (Please note that I do not mean clicking on the carousel entries below the map). Clicking on a marker usually opens the info-window, so I’m guessing it should be modified somewhere there.. but I don’t know where that is.

    Many thanks

    • This reply was modified 2 years ago by  aforshaw.
    #31356

    Dylan
    Moderator

    Hi there,

    Thank you so much for getting in touch.

    Unfortunately marker clicks do not trigger a zoom event currently.

    However this could be achieved by making some code changes if you are open to this?

    #31359

    aforshaw
    Member

    Absolutely yes – I don’t mind modifying the code 🙂 Please point me in the right direction and I’ll make the changes.

    Many thanks

    #31459

    Dylan
    Moderator

    Hi there,

    Thank you so much for your time on this one.

    You will need to edit the core.js file of the plugin (wp-content/plugins/wp-google-maps-pro/js/core.js), and find the “wpgmza_open_marker_func” function within the file.

    Once you have found this function, please find all instances of the following segment of code:

    if (click_from_list) {
        MYMAP[map_id].map.panTo(marker.position);
        MYMAP[map_id].map.setZoom(13);
    }

    There should be 2 instances of this code, which should be replaced with this instead:

    if (click_from_list) {
        MYMAP[map_id].map.panTo(marker.position);
    }
    MYMAP[map_id].map.setZoom(13);

    These code changes can be made via FTP, or alternatively this could also be made from within the WordPress code editor.

    This should zoom in on the marker regardless of whether it is clicked within the map or the marker listing.

    I hope this helps? 🙂

    #31462

    aforshaw
    Member

    Hi Dylan,

    Thanks for that. I’ve made the changes but also needed it to pan to center the marker once clicked before zooming in, so I’ve changed it to:

    if (click_from_list) {
    MYMAP[map_id].map.panTo(marker.position);
    MYMAP[map_id].map.setZoom(18);
    } else { // if clicked on a marker
    MYMAP[map_id].map.panTo(marker.position);
    MYMAP[map_id].map.setZoom(18);
    }

    I’ll be using different zoom levels eventually hence the duplication of zooms but this works.

    Thanks again,

    Anthony

    #31508

    Dylan
    Moderator

    Hi Anthony,

    So glad to hear the code helped in some way, and thank you so much for sharing your solution with us!

    Is there anything else I can assist you with? 🙂

    #48025

    sawmri
    Member

    Is there a way to add this code to the Advanced JS field so that it doesn’t get overwritten when the plugin is updated? Thanks

    #48042

    Dylan
    Moderator

    Hi there,

    Thank you for getting in touch, we do appreciate your time.

    Yes, this can be achieved by adding the following custom JavaScript to your site:

    jQuery("body").on("click", ".wpgmaps_mlist_row, .wpgmaps_blist_row", function(event) {
       var wpgmza_mapid = jQuery(this).attr("mapid");
       setTimeout(function(){
          WPGMZA.getMapByID(wpgmza_mapid).setZoom(5);
       }, 300);
    });

    Please note, you can alter the value 5 to alter the zoom level.

    I hope this helps?

    Kind Regards,
    Dylan Auty

    • This reply was modified 8 months, 3 weeks ago by  Dylan.
    • This reply was modified 8 months, 3 weeks ago by  Dylan.
Viewing 15 posts - 1 through 15 (of 38 total)

You must be logged in to reply to this topic.