0

我在 joomla 2.5 中工作,我必须为Google map创建一个模块并使用Google map api v2

我正在使用 geocoder = new GClientGeocoder();,但它现在正在工作

输出图像:-在此处输入图像描述

我的html<div>标签

<div id="map_canvas" style="width: 800px; height:800px;"></div>

我的剧本

<script>

    //<![CDATA[
    var map = null;
    var geocoder = null;

    function initialize() {

        if (GBrowserIsCompatible()) {

        //calls map to appear inside <div> with id, "map_canvas"
        map = new GMap2(document.getElementById("map_canvas"));

        //adds zoom and arrow controls to map


        geocoder = new GClientGeocoder();

        map.setMapType(G_SATELLITE_MAP);

        var allAddress = "Dubai~Abu Dhabi";
        var addresses = new Array();
        addresses = allAddress.split("~");  



        var curIndex = 0;

        function showAddress() {

          var _cur = addresses[curIndex];


          geocoder.getLatLng(
            _cur,
            function(point) {
            alert(_cur);
              if (!point) {
            alert(_cur + " not found");
              } else {
            alert(_cur+":"+point);


              }
              //do next after done
              curIndex++;
              if(curIndex<addresses.length)
            showAddress();
            }
          );
        }

        showAddress();
         }  
}
//]]>
</script>
4

1 回答 1

1

请参阅下面的代码并尝试一下。

我正在使用 php 静态数组,您可以连接数据库并根据您的要求创建数组。请参阅下面的数组。

<?php  $item = array('jaipur, rajasthan,india', 'udaipur, rajasthan,india'); ?>

在我的代码下面看看。

<html>
    <head>
        <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=AIzaSyDwFjOazEAe1MI7nHV6vUwkWytOp8LH2Zk" type="text/javascript"></script>
    </head>
    <body onload="initialize();">
    <?php  $item = array('jaipur, rajasthan,india', 'udaipur, rajasthan,india'); ?>
    <script>
    var map = null;
    var geocoder = null;

    function initialize() {
            if (GBrowserIsCompatible()) {


                    map = new GMap2(document.getElementById("map_canvas"));
                    var addresses = ["<?php echo implode ('","', $item); ?>"]


                    var geocoder = new GClientGeocoder();
                    //var addresses = ["A II Z, Ibn Battuta Mall, Sheikh Zayed Road, 5th Interchange, Jebel Ali Village, Dubai","A. Testoni,Dubai Festival City Mall, Ground Floor, Dubai", "Abdulla Hussain Khunji, The Dubai Mall,Downtown, Abu Dhabi"];
                    var curIndex = 0;

                    function showAddress() {
                      var _cur = addresses[curIndex];
                      geocoder.getLatLng(
                        _cur,
                        function(point) {
                          if (!point) {
                            //alert(_cur + " not found");
                            //map.setCenter(new GLatLng(0, 0), 6);
                            //map.setUIToDefault();
                          } else {
                            //console.log(_cur+":"+point);
                            //alert(_cur);
                                    var cafeIcon = new GIcon(G_DEFAULT_ICON);

                                    // Set up our GMarkerOptions object
                                    markerOptions = { icon:cafeIcon };

                                    map.setCenter(point, 6);
                                    var marker = new GMarker(point, markerOptions);
                                    map.addOverlay(marker);

                                    var sales = new Array();
                                    sales = _cur.split("|");


                                    //Add click event on push pin to open info window on click of the icon
                                    GEvent.addListener(marker, "click", function() {
                                            marker.openInfoWindowHtml("<p class='para1bold' style=\"font-weight: bold;\">Address <br /><span class='para1' style='font-weight:normal;'>" + sales[1] + "</span></p>");
                                    });
                                    //Provides map,satellite,hybrid and terrain views in the map along with zoom control


                                    map.setUIToDefault();
                          }
                          //do next after done

                          curIndex++;

                          if(curIndex<addresses.length)
                            showAddress();
                        }
                      );
                    }
                    showAddress();
       }  
    }
    </script>
    <div id="map_canvas" style="width:100%; height:750px;"></div>
  </body> 
</html>
于 2012-08-31T04:54:02.610 回答