Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

CrastyCrap's avatar

Prevent Google map marker from center the map

Greeting, i am using google map to list the shops in the system on it the problem is i always find that map are centered on the last shop instead of lat and lng that i provided them

 map = new google.maps.Map(document.getElementById("map"), {
            center: { lat:  21.3891, lng: 39.8579 },
            zoom: 12,
            disableDefaultUI: true 
        });
    
        google.maps.event.addListener(map, 'click', function(event) {
            // placeMarker(event.latLng);
        });

        shop_locations.forEach((shop) => {
            marker = new google.maps.Marker({
                position: new google.maps.LatLng(shop.lat, shop.lng),
                map: map,
                icon: "https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png",
                title: 'asdasd'
            });

            let infowindow = new google.maps.InfoWindow({
                content: `
                <div class="shop_place d-flex align-items-center">
                    <img src="/uploads/shops/${shop.id}/medium/${shop.logo}">
                    <p class="mb-0">${shop.shop_name}</p>
                </div>`,
                ariaLabel: "Uluru",
            });

            google.maps.event.addListener(marker,'click', (function(marker,infowindow){ 
                return function() {
                    infowindow.open({
                        anchor: marker,
                        map,
                    });
                };
            })(marker,infowindow)); 

            infowindow.open(map,marker)
        });

        map.setCenter(new google.maps.LatLng(lat,lng));

        var zoomControlDiv = document.createElement('div');
        var zoomControl = new ZoomControl(zoomControlDiv, map);

        zoomControlDiv.index = 1;
        map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push(zoomControlDiv);

        google.maps.event.addListener(map, 'click', function(event) {
            let current_lat = event.latLng.lat();
            let current_lng = event.latLng.lng();

            $.ajax({
                url: `/shops/shop/map`,
                data: {
                    lat: current_lat,
                    lng: current_lng
                }
            });
        });

``
0 likes
1 reply
Snapey's avatar

where are lat,lng set for this line;

map.setCenter(new google.maps.LatLng(lat,lng));

Please or to participate in this conversation.