Question

我正在使用此插件cordova-plugin-googlemaps 虽然问题不受限制我的结果数组包括名称，地址和latlong。我把标记放在地图上，用于循环。点击标记信息窗口打开。

但我想要的是点击列表视图的项目打开特定的标记信息窗口。

我发布了一些代码以获得微妙的想法。

{{1}}

我想从项目点击列表中获得相同的结果。我可以将相机移动到标记，因为我有latLng，但我想打开lat lng上存在的相同标记的信息窗口。请帮帮我。

Answer 1

    Dynamic Marker in Cordova    


    <!DOCTYPE html>
        <html>
        <head>
            <meta charset="utf-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <script type="text/javascript" src="cordova.js"></script>
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
            <script type="text/javascript">
            var map;

             var data = [];

             var lat,long,snippet,title;

           document.addEventListener("deviceready", function() {

           var xmlhttp = new XMLHttpRequest();
                xmlhttp.onreadystatechange = function() {
                    if (this.readyState == 4 && this.status == 200) {
                       console.log("this.responseText==="+this.responseText);
                       var parse = JSON.parse(this.responseText);

                       var invv = parse.info;

                        console.log("invv=="+invv);

                       var count = invv.length;

                       console.log("count=="+count);

                       var i;

                       for(i = 0 ;i < count ; i++){

                     lat = invv[i].lat;

                      long = invv[i].long;

                       snippet = invv[i].snippet;

                       title = invv[i].title;

                      console.log("title==="+title);

                        data.push({
                      "title" : title,
                      "position": new plugin.google.maps.LatLng(lat,long),

                      });

                       }



                      console.log("data one==="+JSON.stringify(data));

                      sw(JSON.stringify(data));

                    }
                };
                xmlhttp.open("GET", "http://192.168.1.100/tuts_rest/latlong.php", true);
                xmlhttp.send();



          console.log("data two==="+JSON.stringify(data));


          var mapDiv = document.getElementById("map_canvas");

          const GOOGLE = new plugin.google.maps.LatLng(-33.890542, 151.274856);
          var map = plugin.google.maps.Map.getMap(mapDiv, {
            'camera': {
              'latLng': GOOGLE,
              'zoom': 17
            }
          });

        function sw(a){

        map.addEventListener(plugin.google.maps.event.MAP_READY, function() {


            console.log("data==="+a);

             var obj = JSON.parse(a);

             console.log("obj==="+obj);

             var nn = obj.length;

             console.log("nn==="+nn);



        for(var i = 0; i < obj.length;i++){

        addMarkers(obj, function(markers) {
        console.log("a==="+obj);
        console.log("hellooooo");
        console.log(markers[markers.length - 1]);
          markers[markers.length - 1].showInfoWindow();
        });

        }


        function addMarkers(data, callback) {
          var markers = [];
          function onMarkerAdded(marker) {

          console.log("marker==="+JSON.stringify(markers));

            markers.push(marker);
            if (markers.length === data.length) {
              callback(markers);
            }
          }
          data.forEach(function(markerOptions) {
            map.addMarker(markerOptions, onMarkerAdded);
          });

        }
           });



        }



        });

            </script>
        </head>
        <body>
        <h3>PhoneGap-GoogleMaps-Plugin</h3>
        <div style="width:100%;height:400px" id="map_canvas"></div>
        <button id="button">Full Screen</button>
        </body>
        </html>


        JSON Response 

 {"status":1,"info":[{"lat":"-33.890542","long":"151.274856","snippet":"Hello"},{"lat":"-33.923036","long":" 151.259052","snippet":"Hello"}]}


    PHP Code

    <?php
        // Include confi.php
        include_once('config.php');



            $qur = mysql_query("select * from `latlong`");
            $result =array();
            while($r = mysql_fetch_array($qur)){
                extract($r);
                $result[] = array("lat" => $lat, "long" => $long, 'snippet' => $snippet ,'title' => $title); 
            }
            $json = array("status" => 1, "info" => $result);

        @mysql_close($conn);

        /* Output header */
        header('Content-type: application/json');
        echo json_encode($json);
        ?>

    Config.PHP

    <?php
    $conn = mysql_connect("localhost", "root", "");
    mysql_select_db('tuts_rest', $conn);
    ?>

隐藏INFO窗口标记并动态显示它

1 个答案: