CODEWITHSUNDEEP
javascriptjquerymaps
Dennis
Dennis

Reputation: 538

Control the zoom level of Google Mx

I've made a Wordpress website with a template tool 'beaver builder'. That tool has a google map module, but that doesn't work very well. For example, I can't change to zoom level and center.

I also want to show a specific marker in a cluster.

This is the website page: http://www.depot-rato.be/het-project/

Is there a way to control the google map with some Javascript or jQuery?

jQuery('.gmap').setZoom(19);

Thanks in advance.

Upvotes: 1

Views: 43

Answers (2)

Dennis
Dennis

Reputation: 538

I've found a solution: 

jQuery(document).ready(function($) { 
    var aLocation = { lat: 51.009054, lng: 4.509285};

    $('.gmap').gmap('get','map').setOptions(
        {
            'zoom': 18,
            'center': aLocation
        }
    ); 
});

Upvotes: 1

D Sam
D Sam

Reputation: 77

I do it like this(at map initialization, resets the map and markers):

var aLocation= { lat: 48.4728146, lng: 7.499930100000029 };

map = new google.maps.Map(document.getElementById('myMap'), {
    zoom: 5,
    center: aLocation,
    title: 'myMapTitle',
});

or like this(this one shouldn't initialize the map or markers):

map.setZoom(5);
map.setCenter(aLocation);

map.panTo(aLocation);// no need for this one, if you used the one above

You can try it here(click on the marker):

https://codepen.io/sam67/pen/KRGLjY

Upvotes: 0

Related Questions