Question

我正在开发一个网站，我正在尝试合并Google地图。该页面使用php从数据库中获取值。然后它将其中一个列值传递给javascript函数，该函数使用Google Maps绘制它。现在，我想在一张地图中显示所有值的图。

我附加了javascript函数和php调用。这是代码：

<script type="text/javascript">

var myOptions;
var map;
var geocoder;
var first_call = 0;

function map_function(addr){
    // Define the addresses we want to map.
    var clubs = addr;
    // Create a new Geocoder
    if (first_call == 0){
        var geocoder = new google.maps.Geocoder();
    }
    // Locate the address using the Geocoder.
    geocoder.geocode( { "address": clubs }, function(results, status) {
        // If the Geocoding was successful
        if (status == google.maps.GeocoderStatus.OK) {
            if (first_call == 0){
                // Create a Google Map at the latitude/longitude returned by the Geocoder.
                // Create Once
                alert("Initializing Map");
                var myOptions = {
                    zoom: 16,
                    center: results[0].geometry.location,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                //Initialise once
                var map = new google.maps.Map(document.getElementById("map"), myOptions);
            }
            // Add a marker at the address.
            alert("Plotting address");
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
        } else {
                try {
                    console.error("Geocode was not successful for the following reason: " + status);
                } catch(e) {}
            }
    });
    first_call = first_call + 1;
    alert (first_call);
}
</script>
<?php
while($row = mysqli_fetch_array($result)){
    $addr = $row['ADDRESS'];
    echo '<script type="text/javascript">map_function("{$addr}");</script>';
?>

我知道地图及其选项应该只初始化一次。所以我使用first_call跟踪函数调用，并确保仅在第一次调用时初始化映射。此外，我将地图，选项和地理编码器声明为全局变量。不幸的是，我没有得到任何输出。我是javascript的新手，我不知道哪里出错了。

急切地等待解决方案。

Answer 1

我不知道php代码但你的javascript代码有几个错误。

首先，您将mapOptions，map和geocoder定义为全局，然后在本地重新定义每个。因此，在函数var中删除变量前面的map_function。

防止该地图初始化的下一个是first_call变量的更新。由于geocode()是异步函数，first_call设置为1，然后在代码到达检查if (first_call == 0){之前进一步增加。所以地图永远不会被初始化。

下面是使用我的测试代码更改的代码，没有php：

<script type="text/javascript">

var myOptions;
var map;
var geocoder;
var first_call = 0;

function map_function(addr){
    // Define the addresses we want to map.
    var clubs = addr;

    // Create a new Geocoder
    if (first_call == 0){
        geocoder = new google.maps.Geocoder(); // var deleted
    }
    // Locate the address using the Geocoder.
    geocoder.geocode( { "address": clubs }, function(results, status) {
        // If the Geocoding was successful
        if (status == google.maps.GeocoderStatus.OK) {
            if (first_call == 0){
                // Create a Google Map at the latitude/longitude returned by the Geocoder.
                // Create Once
                console.log("Initializing Map");
                myOptions = {
                    zoom: 16,
                    center: results[0].geometry.location,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                //Initialise once
                map = new google.maps.Map(document.getElementById("map"), myOptions);
            }
            // Add a marker at the address.
            console.log("Plotting address");
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            first_call = first_call + 1;
            console.log (first_call);
        } else {
                try {
                    console.error("Geocode was not successful for the following reason: " + status);
                } catch(e) {}
            }
    });
    // wrong place because of async call: map is never initialized
    //first_call = first_call + 1;
    //console.log (first_call);
}

var addresses = ['Paris', 'London', 'Berlin'];
for (var i = 0; i < addresses.length; i++) {
    map_function(addresses[i]);
}

</script>

Answer 2

只是一些输出模板事故。没什么大不了的。我已经为你重写了它。

<?php
while($row = mysqli_fetch_array($result)){
    $addr = $row['ADDRESS'];
    echo '<script type="text/javascript">map_function(' . $addr . ');</script>';
?>

全局变量javascript无法正常工作

2 个答案: