Google Maps - Getting points in Php array, to points on a map

Question

So i have a page called region.php, which in the header, loads JQuery, the google maps API, and the custom Jquery functions I use for my app in a file called functions.js.

In region.php, I pull a few rows from the MySQL DB and store them in a php array, $regions.

In my functions.js file, I'm trying to json_encode the $regions array, and pass it to my function, to plays all of the lats and longitudes of the $regions array on the google map. However, IM having trouble getting the Php array into Javascript.

I had been following this but it doesnt seem to be working for me: Iterating through a PHP array in jQuery?. Doesn't seem like the javascript can work with the php in the example they give

any ideas? (and I suppose if im going about this all wrong -- what is the best way to get the php array into javascript?

Region.php $regions = get_regions();

foreach($regions as $region) : 

    print $region['name']; 

endforeach;


print "<div id='map_view_canvas' style=\"width:300px; height:300px; \"></div>";

functions.js

$(document).ready(function() { 

    initialize_view_map(); 
}

function initialize_view_map() 
{   
    var latlng = new google.maps.LatLng(9.3939, 20.57268);
    var myOptions = {
        zoom: 2,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_view_canvas"), myOptions);

    var mapPoints = <?php echo json_encode($regions) ?>;

    $.each(mapPoints, function (i, elem) {

        var newLatLng = new google.maps.LatLng(elem.latitude, elem.longitude);

        var marker = new google.maps.Marker({
            position: newLatLng, 
            map: map, 
            draggable:false,
            animation: google.maps.Animation.DROP
        });

    });
}

Could you show us some of your code?

Mark Elliot
– Mark Elliot

2011-07-06 03:19:35 +00:00
Commented Jul 6, 2011 at 3:19 — Mark Elliot
– Mark Elliot, Commented Jul 6, 2011 at 3:19

mutex · Accepted Answer · 2011-07-06 04:06:56Z

5

From the example you link to:

var arrayFromPHP = <?php echo json_encode($viewFields) ?>;

that needs to go in a php file not your functions.js file, which is what it sounds like you've done. The code between is php, so needs to run on the server side, it can't run in javascript (which is client side and so knows nothing about php or any server side code\variables\etc)

EDIT:

Now that you've added your code, try something like the following. Sorry, I'm not too familar with php, but hopefully you get the idea:

Regions.php

$regions = get_regions();

foreach($regions as $region) : 

    print $region['name']; 

endforeach;

print "<script>";
print "var mapPoints = ";
echo json_encode($regions->toArray());
print "</script>";
print "<div id='map_view_canvas' style=\"width:300px; height:300px; \"></div>";

Then your Javascript becomes (note the mapsPoint variable has been output by the regions.php already so I remove it here)

$(document).ready(function() { 

    initialize_view_map(); 
}

function initialize_view_map() 
{   
    var latlng = new google.maps.LatLng(9.3939, 20.57268);
    var myOptions = {
        zoom: 2,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_view_canvas"), myOptions);

    $.each(mapPoints, function (i, elem) {

        var newLatLng = new google.maps.LatLng(elem.latitude, elem.longitude);

        var marker = new google.maps.Marker({
            position: newLatLng, 
            map: map, 
            draggable:false,
            animation: google.maps.Animation.DROP
        });

    });
}

EDIT2:

Another thing to try is rename your functions.js to function.js.php, update any references to it and then try that - then it would hopefully run through the php pipeline and run the php code in your js file.

edited Jul 6, 2011 at 4:06

answered Jul 6, 2011 at 3:25

mutex

7,7469 gold badges47 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

djt Over a year ago

ah i see. so is that an error in that answer? It looks like by: var arrayFromPHP = <?php echo json_encode($viewFields) ?>; -- that they mean for that to be a javascript variable..

mutex Over a year ago

No, that answer is right. They just don't have a seperate javascript file like you have. You could embed your javascript in your php file, or just load it into a javascript variable in your php, then use it in your javascript file (that's a bit like a global variable though so not too nice)

djt Over a year ago

hm i see. so is there a better what to go about this?

djt Over a year ago

hm doesn't seem to be doing the trick. when I view the source on region.php, i see "var mapPoints = {}". Though var_dump($regions) is full of info. $regions is the result of a doctrine query. I don't know if that has anything to do with it

mutex Over a year ago

replace echo json_encode($regions); with echo json_encode($regions->toArray()); or if you want to try the second option (js.php) then var mapPoints = <?php echo json_encode($regions->toArray()) ?>;

|

Collectives™ on Stack Overflow

Google Maps - Getting points in Php array, to points on a map

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related