Question

我想用从数据库中提取的数据替换纬度和经度，例如 - destinations.push（new google.maps.LatLng（“varLat”，“varLong”））; - 并使这些变量从数据库中检索信息。这样我就可以在数据库中输入新的coodinates并在地图上绘制它们。 .................................................. .................................................. .................................................. .................................................. .................................................. ...............

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>GeoCerca</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>#mymap {width: 90%; height: 600px;}</style>
         <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCex4QTqx_NqpnuLgSUfdRaLPPmnVDX3es&callback=initMap"
  type="text/javascript"></script>
        
        <script>
            function init(){
                var mapDiv = document.getElementById("mymap");
                var mapOptions ={
                    center: new google.maps.LatLng(14.555071, -90.734250),
                    zoom: 13,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(mapDiv, mapOptions);
                var uluru ={lat: 14.56435, lng: -90.73757};
                var marker = new google.maps.Marker({
                    position: uluru,
                    map:map
                });
                
                var destinations = [];
                /*PUNTO 1*/destinations.push(new google.maps.LatLng(14.57012, -90.75101));
                /*PUNTO 2*/destinations.push(new google.maps.LatLng(14.57261, -90.71874));
                /*PUNTO 3*/destinations.push(new google.maps.LatLng(14.53888, -90.71788));
                /*PUNTO 4*/destinations.push(new google.maps.LatLng(14.53722, -90.75153));
                /*PUNTO 1*/destinations.push(new google.maps.LatLng(14.57012, -90.75101));
                
                var polylineOptions = {path: destinations};
                var polyline = new google.maps.Polyline( polylineOptions);
                polyline.setMap(map);
                
                var destinationsB = [];
                destinationsB.push(new google.maps.LatLng(14.58889, -90.75127));
                destinationsB.push(new google.maps.LatLng(14.59081, -90.73101));
                destinationsB.push(new google.maps.LatLng(14.5761, -90.72956));
                destinationsB.push(new google.maps.LatLng(14.57502, -90.75101));
                destinationsB.push(new google.maps.LatLng(14.58889, -90.75127));
                
                var polylineOptions = {path: destinationsB};
                var polyline = new google.maps.Polyline( polylineOptions);
                polyline.setMap(map);
                
                var destinationsC = [];
                destinationsC.push(new google.maps.LatLng(14.52584, -90.77161));
                destinationsC.push(new google.maps.LatLng(14.53008, -90.75363));
                destinationsC.push(new google.maps.LatLng(14.52397, -90.75071));
                destinationsC.push(new google.maps.LatLng(14.51982, -90.76972));
                destinationsC.push(new google.maps.LatLng(14.52584, -90.77161));
                
                var polylineOptions = {path: destinationsC};
                var polyline = new google.maps.Polyline( polylineOptions);
                polyline.setMap(map);
            }
            window.onload = init;
        </script>
    </head>
    <body>
        <?php
        
        ?>
        <h2>Geocercas</h2>
        <div id="mymap"> </div>
        <div id="info"> </div>
    </body>
</html>

Answer 1

首先从数据库获取数据并将其存储在javascript变量中喜欢

var locations_array = {!! json_encode($location) !!};

然后使用for循环

    for(i = 0; i <= locations_array.length; i++) {
         destinationsB.push(new google.maps.LatLng(locations_array.lat, locations_array.long));
    }

Answer 2

创建一个位置类来存储纬度和经度值：

class Location {

    public $latitude;
    public $longitude;

    public function __construct($latitude, $longitude) {
        $this->latitude = $latitude;
        $this->longitude = $longitude;
    }
}

然后，访问数据库以检索纬度和经度值，如下例所示。只需更改以下数据库URL +凭据：

$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT latitude, longitude FROM coordinates";
$result = $conn->query($sql);

$locations = array();
if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
        array_push($locations, new Location($row["latitude"], $row["longitude"]));
    }
} else {
    echo "0 results";
}
$conn->close();

然后将JavaScript数组分配给php位置数组，如下所示：

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

在JavaScript数组中获得纬度和经度值后，迭代数组并将经度和纬度值添加到目的地。

for (var i = 0; i < locations.length; i++) {
    destinations.push(new google.maps.LatLng(locations[i].latitude, locations[i].longitude));
}

关于如何从数据库中检索数据并将其用作变量

2 个答案: