如何在谷歌地图中获取drop point lat和lng

时间:2017-06-10 19:45:34

标签: javascript google-maps

在这里,我添加了一些带有标记的基本谷歌地图,我需要的是获取谷歌地图中的放置点<table> <tbody> <tr> <td>Product Name:</td> <td><input type="text" name="product_name"></td> </tr> <tr> <td>Product Brand</td> <td> <select name="" id=""> <optgroup label="Select a Brand"></optgroup> <?php global $conn; try{ //prepare statement $statement=$conn->prepare('select * from brands'); //bind statement parameters $statement->bindParam(':brand_id', $brand_id); $statement->bindParam(':brand_name', $brand_name); //execute statement $statement->execute(); while($result=$statement->fetch()){ $brand_id = $result['brand_id']; $brand_name = $result['brand_name']; echo "<option value=".$brand_id.">" .$brand_name. "</option>"; } } catch(PDOException $e){ echo 'Error: ' . $e->getMessage(); } $conn = null; ?> </select> </td> </tr> <tr> <td>Product Category </td> <td> <select name="" id=""> <optgroup label="Select a Category"></optgroup> <?php global $conn; try{ //prepared statement $statement = $conn->prepare('select * from categories'); //bind parametes $statement->bindParam(':category_id', $category_id); $statement->bindParam(':category_name', $category_name); //execute $statement->execute(); //set the result while($result=$statement->fetch()){ $category_id = $result['category_id']; $category_name = $result['category_name']; echo "<option value=".$category_id.">" .$category_name. "</option>"; } } catch(PDOException $e){ echo 'Error: ' . $e->getMessage(); } $conn = null; ?> </select> </td> </tr> <tr> <td>Product Image</td> <td><input type="file" name="product_image"></td> </tr> <tr> <td>Product Description</td> <td><textarea name="product_description" id="" cols="30" rows="10"></textarea></td> </tr> <tr> <td>Product Price</td> <td><input type="text" name="product_price"></td> </tr> <tr id="submit_row" align="center"> <td class="submit_row" align="center"> <input type="submit" name="submit-button"> </td> </tr> </tbody> </table> Lat位置。我已经将google地图集成到了JS Components中。

Lng

initializeMap(){
    var myLatlng = new google.maps.LatLng(13.083432624993291, 80.27261740398262);
    var dragOn = true;
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 16,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      animation: google.maps.Animation.DROP,
      draggable: dragOn 
    });
    setTimeout(function(){
        marker.setAnimation(google.maps.Animation.BOUNCE);
    }, 1000);
}

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD_iFsNeNE2pqOUE86VFrvecTZQqyEb7ic&libraries=places"></script>
html,
body,
#map {
  height: 100%;
  width: 100%;
}

这是我用过的谷歌地图库。我尝试使用此代码但无法正常工作。任何人都可以帮助我

2 个答案:

答案 0 :(得分:1)

获取“drop point”..我假设您点击地图的位置的lat,lng可以使用管理事件的listerner(在此示例中作为e传递)

google.maps.event.addListener(map, 'click', function (e) {
     console.log( e.latLng.lat());
     console.log( e.latLng.lng());
});

您可以在浏览器控制台中查看结果..或使用alert(e.latLng.lat())打开测试窗口

答案 1 :(得分:0)

您可以使用dragend事件并将其添加到您的标记中,如下所示:

google.maps.event.addListener(marker, 'dragend', function(event) {
   alert( 'Lat: ' + event.latLng.lat() + ' and Longitude is: ' + event.latLng.lng() );
});