谷歌地图 - 获取Php数组中的点,到地图上的点

Question

所以我有一个名为region.php的页面,它在标题中加载了JQuery,google maps API,以及我在app.js文件中用于我的app的自定义Jquery函数.

在region.php中,我从MySQL数据库中提取几行并将它们存储在php数组中,$ regions.

在我的functions.js文件中,我正在尝试对$ regions数组进行json_encode,并将其传递给我的函数,以在google地图上播放$ regions数组的所有lats和经度.但是,IM无法将Php阵列转换为Javascript.

我一直在关注这个但它似乎并没有为我工作:在jQuery中迭代PHP数组？.似乎javascript可以在他们提供的示例中使用php

有任何想法吗？(我想如果我这样做完全错了 - 将php数组放入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
        });

    });
}

Answer 1

从您链接到的示例:

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

需要进入一个php文件而不是你的functions.js文件,这听起来像你已经完成了.之间的代码是php,所以需要在服务器端运行,它不能在javascript中运行(这是客户端,因此对php或任何服务器端代码\变量\等一无所知)

编辑:

现在您已添加了代码,请尝试以下操作.对不起,我不太熟悉php,但希望你明白这个想法:

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>";

然后你的Javascript变成了(注意mapsPoint变量已经由regions.php输出,所以我在这里删除它)

$(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:

另一件事是将你的functions.js重命名为function.js.php,更新对它的任何引用,然后尝试 - 然后它希望通过php管道运行并在你的js文件中运行php代码.