从 MySQL 数据库加载纬度/经度并使用 PHP、html 和 JavaScript 在谷歌地图上显示点
[英]Loading latitude/longitude from MySQL database and showing point on Google Maps using PHP,html and JavaScript
问题描述
I googled a lot but all the solutions i found didn't work for me (even google maps tutorial).
我用谷歌搜索了很多，但我发现的所有解决方案都不适合我（甚至谷歌地图教程）。 I have a MySQL database where I store latitude and longitude values in Float type columns.我有一个 MySQL 数据库，我将纬度和经度值存储在 Float 类型列中。 I wrote php script which connects to the database and selects those values.我编写了连接到数据库并选择这些值的 php 脚本。 The idea is that php script passes an array of longitude and latitude values to JavaScript and then Javascript iterate on that array making new markers on Google Maps.这个想法是 php 脚本将一组经度和纬度值传递给 JavaScript，然后 Javascript 迭代该数组，在谷歌地图上制作新标记。 Here is my actual code:这是我的实际代码：
<html> <head> <style> #map { width: 100%; height: 700px; background-color: grey; } </style> </head> <body> <?php $query ="SELECT latitude,longitude FROM markers"; $result_array=Array(); $con = new mysqli($host, $user, $password, $dbname, $port) or die ('Could not connect to the database server' . mysqli_connect_error()); $result = mysqli_query($con,$query); while($row = mysqli_fetch_array($result,MYSQLI_ASSOC)){ $latitude=$row['latitude']; $longitude=$row['longitude']; $result_array[]=array('latitude'=>$latitude,'longitude'=>$longitude); } $json=json_encode($result_array); $con->close(); ?> <h3>MyMap</h3> <div id="map"></div> <script> function initMap() { var mapDiv = document.getElementById('map'); var map = new google.maps.Map(mapDiv, { center: {lat: 41.5400 , lng: 12.2500}, zoom: 6 }); var array="<?php echo $json_array;?>"; for(var i=0;i<array.length;i++){ var myLatLng=new google.maps.LatLng(lat,lon); var marker=new google.maps.Marker({ map:map, position: myLatLng, }); //} } </script> <script async defer src=MY GOOGLE API MAP> </script> </body> </html>
Can anyone help me or suggest other ways to do the same thing?任何人都可以帮助我或建议其他方法来做同样的事情吗？
2 个解决方案
解决方案1
0 2016-07-27 15:21:44
Try putting newlines between <?php and the actual content, like so:尝试在<?php和实际内容之间放置换行符，如下所示：
var array=JSON.parse("<?php
echo $json_array;
?>");
The PHP substitution should put the double quotes on the same line. PHP 替换应该将双引号放在同一行上。
解决方案2
0 2020-12-19 10:27:31
<html> <head> <style> #map { width: 100%; height: 700px; background-color: grey; } </style> </head> <body> <?php $query ="SELECT latitude,longitude FROM markers"; $result_array=Array(); $con = new mysqli($host, $user, $password, $dbname, $port) or die ('Could not connect to the database server' . mysqli_connect_error()); $result = mysqli_query($con,$query); while($row = mysqli_fetch_array($result,MYSQLI_ASSOC)){ $latitude=$row['latitude']; $longitude=$row['longitude']; $result_array[]=array('latitude'=>$latitude,'longitude'=>$longitude); } $json=json_encode($result_array); $con->close(); ?> <h3>MyMap</h3> <div id="map"></div> <script> function initMap() { var mapDiv = document.getElementById('map'); var map = new google.maps.Map(mapDiv, { center: {lat: 41.5400 , lng: 12.2500}, zoom: 6 }); var array="<?php echo $json;?>";//here changed for(var i=0;i<array.length;i++){ var myLatLng=new google.maps.LatLng(lat,lon); var marker=new google.maps.Marker({ map:map, position: myLatLng, }); //} } </script> <script async defer src=MY GOOGLE API MAP> </script> </body> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.