使用两个不同表格中的值在一个Google地图上显示标记

Here is my code. It reads latitude and longitude from a database table and adds markers onto the map. What I want to do is to add another table in it and add different-colored markers according to its latitude and longitude values on the same map. I do not know how to take latitude and longitude from two different tables and show on map with different-color markers.

这是我的代码。它从数据库表中读取纬度和经度，并将标记添加到地图上。我想要做的是在其中添加另一个表，并根据其在同一地图上的纬度和经度值添加不同颜色的标记。我不知道如何从两个不同的表中获取纬度和经度，并在地图上显示不同颜色的标记。

function initialize() {
    <?php echo "initializing: ";?>
    var position = new google.maps.LatLng(39.40233290,77.89265660 );
    var image = {
        url: 'images/image.png',
        // This marker is 20 pixels wide by 32 pixels high.
        size: new google.maps.Size(30, 32)
    };

    var myOptions = {
        zoom: 10,
        center: position,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    <?php       
    $sql="select latitude,longitude FROM coffeeshop ";
    $records = mysql_query($sql, $conn);
    if (!$records) {
        echo "Could not successfully run query ($sql) from DB: " . mysql_error();
        exit;
    }

    while($row = mysql_fetch_assoc($records)) {
        ?>
        var lat= <?php echo $row['latitude'] ?>;
        var long=<?php echo $row['longitude'] ?>;
        addMarker(lat,long);
        <?php echo $row['longitude'];
    }
    ?>

    var geocoder = new google.maps.Geocoder;
    var infowindow = new google.maps.InfoWindow;  

    var marker = new google.maps.Marker({
        position: position,
        map: map,
        title:"This is the place."
    });  

    var marker2 = new google.maps.Marker({
        position: position,
        map: map,
        icon: image,
        title:"This is the place."
    });  

    var contentString = 'Hello <strong>World</strong>!';
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map,marker);
        geocodeLatLng(geocoder, map, infowindow);
    });

    google.maps.event.addListener(marker2, 'click', function() {
        infowindow.open(map,marker2);
        geocodeLatLng(geocoder, map, infowindow);
    });

    function addMarker(lat,long) {
        var latlongMarker = new google.maps.LatLng(lat,long);

        var marker = new google.maps.Marker({
            position: latlongMarker, 
            map: map,            
        }); 

        var marker2 = new google.maps.Marker({
            position: latlongMarker, 
            map: map,
            icon:image,            
        }); 

        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map,marker);
            geocodeLatLng(geocoder, map, infowindow,marker);     
        });
    }    
}

1 个解决方案

#1

I recommend you to use ajax, to get the values no the mysql functions.

我建议你使用ajax，以获取没有mysql函数的值。

With ajax you can get data from certain php method. This method can gather all data needed from db (in you case from two tables) and prepare it as one array (you have to encode it to json to get it via ajax).

使用ajax，您可以从某些php方法获取数据。此方法可以收集db所需的所有数据（在您的情况下来自两个表）并将其准备为一个数组（您必须将其编码为json以通过ajax获取它）。

Also code will be cleaner, as you don't mess php with javascript.

代码也会更干净，因为你不用PHP乱码php。

#1