在谷歌地图中做“沿途的兴趣点”

Posted

技术标签:

【中文标题】在谷歌地图中做“沿途的兴趣点”【英文标题】:doing "points of interest along a route" in google maps 【发布时间】:2011-04-29 17:38:53 【问题描述】:

我需要允许旅行者使用谷歌地图绘制路线,然后查询我的兴趣点数据库(比如说,麦当劳的位置),然后显示所有这些位置在一两英里内的路线他们将采取。问题是,我如何有效地获取从谷歌返回的“行车路线”信息(本质上是一组纬度/经度对),并将其转换为 sql 查询以获取距离路线一定距离内的位置?

它不必非常精确,与路线的“鸟儿飞翔”距离就可以了。我最担心它的效率是否合理。

在数据库中,基本上每个条目都有一个纬度和经度,但我可以根据需要更改数据库架构。

作为一个例子,这个网站做了我想做的事情(如果你给出一个起点和终点,它将显示你将要走的高速公路附近的雪佛龙车站): http://www.chevron.com/products/stations/stationfinder/planyourroute.aspx

(来源:karmatics.com)

【问题讨论】:

【参考方案1】:

看看这个

http://google-maps-utility-library-v3.googlecode.com/svn/tags/routeboxer/1.0/examples/routeboxer-v3.html

这是文档:http://google-maps-utility-library-v3.googlecode.com/svn/tags/routeboxer/1.0/docs/examples.html

您可以从 RouteBoxer 获取框坐标并将其发送到服务器端脚本进行处理

【讨论】:

完美,正是我想要的。 我一直在寻找一个星期的答案!谢谢! 链接已失效。 :(【参考方案2】:
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Polygon arrays</title>
    <style>
      #map 
        height: 100%;
      
      html, body 
        height: 100%;
        margin: 0;
        padding: 0;
      
    </style>
  </head>

  <body>
    <div id="map"></div>
     <script>    
var map;
      function initMap() 
         map = new google.maps.Map(document.getElementById('map'), 
          center: lat: 19.2570, lng: 72.8712,
          zoom: 10,
        );

        var directionService = new google.maps.DirectionsService();
        var directionsRenderer = new google.maps.DirectionsRenderer( map: map ); 
        var request = 
           origin: "<?php echo $source;?>",
          destination: "<?php echo $destination;?>", 
          travelMode: google.maps.DirectionsTravelMode.DRIVING
        


        directionService.route(request, function(result, status) 
        if (status == google.maps.DirectionsStatus.OK) 

            var path = result.routes[0].overview_path;

            var poly = new google.maps.Polyline(
              strokeColor: '#FF0000',
              strokeOpacity: 1.0,
              strokeWeight: 3,
             map: map,
            );
            poly.setPath(path);


            var myTollLocations = [
              <?php

                 isset($hello); //$hello is array which comes from database
              foreach ($hello as $key => $value) 
                ?>
                  new google.maps.LatLng(<?php echo $hello[$key]->latitude;?>, <?php echo $hello[$key]->longitude;?>),
                <?php
              
              ?>

            ];


            for (var i = 0; i < myTollLocations.length  ; i++) 
              if (google.maps.geometry.poly.isLocationOnEdge(myTollLocations[i], poly,0.005)) 
                  console.log("found");


                else
                  console.log("Not Found!");
                
            ;




           <?php
           $markersLocation =  array($source, $destination);
             foreach ($markersLocation as $key => $values) 

             ?>


          //Source Marker( convert address to LatLng for marker)   
           var geocoder = new google.maps.Geocoder();            
            geocoder.geocode(  'address': '<?php echo $markersLocation[$key]?>', function(results, status) 

                if (status == google.maps.GeocoderStatus.OK) 
                    var latitude = results[0].geometry.location.lat();
                    var longitude = results[0].geometry.location.lng();
                

                console.log(latitude);
                console.log(longitude);

                var myLatLng = lat: latitude, lng: longitude;



                var marker = new google.maps.Marker(
                    position: myLatLng,
                    map: map,
                    title: 'source',
                    icon: 'http://innowrap.com/clients/digitoll/ic_red_marker.png'

                );

            );


            <?php
           
            ?>


           else 
            alert("Directions query failed: " + status);
          
        );


      


    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=ADD YOUR API KEY&libraries=geometry&callback=initMap"
         async defer></script>
  </body>
</html> 

【讨论】:

虽然欢迎使用此代码 sn-p,并且可能会提供一些帮助,但它会是 greatly improved if it included an explanation of howwhy 这解决了问题。请记住,您正在为将来的读者回答问题,而不仅仅是现在提问的人!请edit您的答案添加解释,并说明适用的限制和假设。

以上是关于在谷歌地图中做“沿途的兴趣点”的主要内容,如果未能解决你的问题,请参考以下文章

使用 TimerTask 在谷歌地图中设置地图

在谷歌地图颤动中设置标记

在谷歌地图中隐藏纬度和经度

如何在谷歌地图上画线

有没有可能在谷歌地图上制作工具栏?

在谷歌地图上显示风向