Loading a marker in Google Maps when loading a page

1971 views javascript
-2

I have this code:

<?php
$lat = '52.29924142';
$lng = '19.18350241';
?>

<script type="text/javascript">
    //<![CDATA[

    var map = null;
    var marker = null;

    var infowindow = new google.maps.InfoWindow(
        {
            size: new google.maps.Size(150, 50)
        });

    function createMarker(latlng, name, html) {
        var contentString = html;
        var marker = new google.maps.Marker({
            position: latlng,
            map: map,
            zIndex: Math.round(latlng.lat() * -100000) << 5
        });

        google.maps.event.addListener(marker, 'click', function () {
            infowindow.setContent(contentString);
            infowindow.open(map, marker);
        });
        google.maps.event.trigger(marker, 'click');
        return marker;
    }


    function initialize() {
        var myOptions = {
            zoom: 7,
            center: new google.maps.LatLng(<?php echo $lat;?>, <?php echo $lng;?>),
            mapTypeControl: true,
            mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
            navigationControl: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);

        google.maps.event.addListener(map, 'click', function () {
            infowindow.close();
        });

        google.maps.event.addListener(map, 'click', function (event) {
            if (marker) {
                marker.setMap(null);
                marker = null;
            }
            marker = createMarker(event.latLng, "name", "<b>Wska? lokalizacj? obiektu</b><br>" + event.latLng);

            $(".lat").val(event.latLng.lat);
            $(".lng").val(event.latLng.lng);
        });

    }


    //]]>
</script>

<input type="hidden" name="lat" value="<?php echo $lat;?>" class="lat">
<input type="hidden" name="lng" value="<?php echo $lng;?>" class="lng">
<div id="map_canvas" ></div>

My current code displays a google map and when you click on the map, it adds a marker along with information about geographic coordinates. In addition, coordinates are added to 2 inputs.

In the $ years and $ lng variables in php, I have the coordinates stored.

The problem is that the marker is displayed only after the first click on the map.

I would like to see a marker in $ years and $ lng when the web page is loaded.

One marker can be in one moment.

Does anyone know how to do it?

answered question

1 Answer

6

You can add event listener on window loaded:

google.maps.event.addDomListener(window, 'load', addMarker);

function addMarker() {
    if (marker) {
        marker.setMap(null);
        marker = null;
    }
    marker = createMarker(event.latLng, "name", "<b>Wska? lokalizacj? obiektu</b><br>" + event.latLng);

    $(".lat").val(event.latLng.lat);
    $(".lng").val(event.latLng.lng);
}

posted this

Have an answer?

JD

Please login first before posting an answer.