CODEWITHSUNDEEP
javascriptgoogle-maps
Brett
Brett

Reputation: 20049

Using a variable inside another

I'm trying to pass a value via PHP to a Javascript function but it isn't working, the value doesn't appear to be going through. When I replace the variable with static text, it works fine.

I'm calling the function via a PHP file like so..

<?php
if (!empty($data['geocode'])) {
    echo '<body onload="initializeGM(\'' . $data['geocode'] . '\');">';
} else {
    echo '<body>';
}
?>

$data['geocode'] contains both the lat and lng as a string.

Here is the Javascript code..

function initializeGM(geocode) {
  var myOptions = {
    zoom: 8,
    center: new google.maps.LatLng(geocode),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

I have added an alert(geocode) into the JS function to test and it works fine.

How can I make it so I can pass the geocode variable in and it works?

Upvotes: 0

Views: 109

Answers (2)

James Allardice
James Allardice

Reputation: 165951

Assuming I've understood your question correctly, geocode is a PHP variable and you want to pass that into a JavaScript function call. If that's the case, you need to echo out the value of the PHP variable:

new google.maps.LatLng(<?php echo($geocode); ?>);

However, note that the LatLng constructor expects 2 arguments of type Number (and an optional boolean argument), and you are only trying to pass in one argument. Although I may have completely misunderstood your intentions.

Edit (see comments)

I didn't notice that you were passing geocode as an argument to the initializeGM function. If you were actually trying to pass your PHP variable into that function you need to modify the call to the JavaScript function to use the PHP variable:

initializeGM(<?php echo($geocode); ?>);

The above "however" paragraph still applies though. Your code is likely to throw an error as lng will be undefined in the LatLng constructor function.

Edit again (see edited question)

What you have appears at first glance that it should result in something along these lines (as you've stated that geocode contains a string):

<body onload="initializeGM('somelat,somelng');">

There is nothing wrong with that in theory (a string will be passed into initializeGM) but the problem is that the function expects two arguments of type Number, not one argument of type String:

<body onload="initializeGM(100, 200);"> <!--Use real lat-lng values here!-->

That would require a change to the JavaScript function:

function initializeGM(lat, lng) { //2 arguments
    var myOptions = {
        zoom: 8,
        center: new google.maps.LatLng(lat, lng), //Pass 2 arguments to constructor
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

Upvotes: 3

Phil
Phil

Reputation: 164736

The google.maps.LatLng constructor takes a minimum of two arguments, lat:number and lng:number. You are only passing one.

Assuming $data['geocode'] looks something like 1.234,5.678, try this...

  1. Change your JS function to

    function initializeGM(lat, lng) {
  var myOptions = {
    zoom: 8,
    center: new google.maps.LatLng(lat, lng),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

  2. Change the call to

    <?php if (!empty($data['geocode'])) :
$coords = explode(',', $data['geocode']);
?>
<body onload="initializeGM(<?php printf('%.15f, %.15f', $coords[0], $coords[1]) ?>)">
<?php else : ?>
<body>
<?php endif ?>

Upvotes: 1

Related Questions