使用随机位置方法显示所有位置

Posted

技术标签:

【中文标题】使用随机位置方法显示所有位置【英文标题】:Display all locations with random locations method 【发布时间】:2019-09-08 17:58:33 【问题描述】:

我在显示从 mysql 获取的位置周围的随机位置时遇到了问题,该方法找到了Here。当我直接为 lat 和 lng 赋值时,它的工作完美,但在我的代码中使用 mysql 数据后无法在地图上显示随机位置,谷歌地图仅显示来自 mysql 的位置,如图所示。所以我希望有人可以帮助我解决我的问题。

the result after run the code

数据库和数据定义为:

CREATE TABLE IF NOT EXISTS `map` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` text NOT NULL,
  `desc` text NOT NULL,
  `lat` text NOT NULL,
  `lon` text NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=7 ;

--
-- Dumping data for table `map`
--

INSERT INTO `poi_example` (`id`, `name`, `desc`, `lat`, `lon`) VALUES
(1, '100 Club', 'Oxford Street, London  W1<br/>3 Nov 2010 : Buster Shuffle<br/>', '51.514980', '-0.144328'),
(2, '93 Feet East', '150 Brick Lane, London  E1 6RU<br/>7 Dec 2010 : Jenny & Johnny<br/>', '51.521710', '-0.071737'),
(3, 'Adelphi Theatre', 'The Strand, London  WC2E 7NA<br/>11 Oct 2010 : Love Never Dies', '51.511010', '-0.120140'),
(4, 'Albany, The', '240 Gt. Portland Street, London  W1W 5QU', '51.521620', '-0.143394'),
(5, 'Aldwych Theatre', 'Aldwych, London  WC2B 4DF<br/>11 Oct 2010 : Dirty Dancing', '51.513170', '-0.117503'),
(6, 'Alexandra Palace', 'Wood Green, London  N22<br/>30 Oct 2010 : Lynx All-Nighter', '51.596490', '-0.109514');

以及显示地图的php文件:

    <?php
    $conn = mysql_connect("localhost", "hani", "hani") or die(mysql_error());
    mysql_select_db("map4") or die(mysql_error());
    ?>

<?php
$conn = mysql_connect("localhost", "hani", "hani") or die(mysql_error());
mysql_select_db("map4") or die(mysql_error());
?>

    <html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
        <title>Google Maps</title>
        <style type="text/css">
            body  font: normal 10pt Helvetica, Arial; 
            #map  width: 1300px; height: 600px; border: 0px; padding: 0px; 
        </style>
        <script src="http://maps.google.com/maps/api/js?key=key=loadMap&sensor=false" type="text/javascript"></script>
        <script type="text/javascript">
            //Sample code written by August Li
            var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",
                       new google.maps.Size(320, 320), new google.maps.Point(0, 0),
                       new google.maps.Point(16, 32));
            var center = null;
            var map = null;
            var currentPopup;
            var bounds = new google.maps.LatLngBounds();
            function addMarker(lat, lng, info) 
                var pt = new google.maps.LatLng(lat, lng);
                bounds.extend(pt);

                var marker = new google.maps.Marker(
                    position: pt,
                    icon: icon,
                    map: map
                );
                var popup = new google.maps.InfoWindow(
                    content: info,
                    maxWidth: 300
                );
                google.maps.event.addListener(marker, "click", function() 
                    if (currentPopup != null) 
                        currentPopup.close();
                        currentPopup = null;
                    
                    popup.open(map, marker);
                    currentPopup = popup;
                );
                google.maps.event.addListener(popup, "closeclick", function() 
                    map.panTo(center);
                    currentPopup = null;
                );

             
            // random location method start from there 


                // random location method end there 

            function initMap() 
                map = new google.maps.Map(document.getElementById("map"), 
                    center: new google.maps.LatLng(0, 0),
                    zoom: 14,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    mapTypeControl: true,
                    mapTypeControlOptions: 
                        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                    ,
                    navigationControl: true,
                    navigationControlOptions: 
                        style: google.maps.NavigationControlStyle.ZOOM_PAN
                    
                );
<?php
$query = mysql_query("SELECT * FROM map")or die(mysql_error());
while($row = mysql_fetch_array($query))

  $name = $row['name'];
  $lat = $row['lat'];
  $lon = $row['lon'];
  $desc = $row['desc'];



  echo("addMarker($lat, $lon, '<b>$name</b><br />$desc');\n");



?>
 center = bounds.getCenter();
     map.fitBounds(bounds);

     
     </script>
     </head>
     <body onload="initMap()" style="margin:0px; border:0px; padding:0px;">
     <div id="map"></div>
     </body>
     </html>

【问题讨论】:

Why shouldn't I use mysql_* functions in PHP?的可能重复 没有重复的先生,我正在使用 php 5.6 并且代码与代码 Mysql 和 mysqli 配合良好,您可以查看图片以获取输出。问题是地图上没有显示的随机位置 您需要尽快停止使用 PHP 5。它不再受支持,并且您不太可能获得社区不再使用的 PHP 版本的任何帮助。 我会将代码更新为 php 7 并使用 mysqli。 试试 PDO,它更容易更好。由于尚未升级,您会错过更多。 PHP 7 有很多新特性,通常速度更快。 【参考方案1】:

您的代码有几个语法问题:

您的函数 addMarker 在生成随机标记的部分之前完成:您必须在调用 googlemaps 函数之后将 移动到 initMap() 函数之前

google.maps.Marker1 : 去掉尾随的 1

, x0 = long : lng,不是long

【讨论】:

谢谢先生,我照你说的做了,现在没有显示任何东西或显示地图,你能编辑一下代码吗?再次感谢

以上是关于使用随机位置方法显示所有位置的主要内容,如果未能解决你的问题,请参考以下文章

为啥 RecyclerView 项目在 GridLayoutManager 中随机移动位置?

C#全屏随机位置显示图片的小程序

Python 随机产生[0,100]以内的随机数,找到最大值和最小值并交换位置

谷歌地图 - 位置不断在我的真实位置和 0.6 英里之外(随机地点)之间跳跃

使随机标签位置适应窗口大小的最有效方法是啥?

随机交换 4 个 UIButton 的位置