如何从gmaps RECTANGLE（Overlay）获取4个顶点坐标？ [英] How to get 4 vertex coordinates from gmaps RECTANGLE ( Overlay)?

问题描述

如何从gmaps RECTANGLE（Overlay）获得4个顶点坐标？

我只能从 selectedShape获得长和长的坐标。 getBounds（）

解决方案

NorthWest = NorthEast Lat，SouthWest Lng

SouthEast = SouthWest Lat，NorthEast Lng

  var bounds = rectangle.getBounds（）; 
 var NE = bounds.getNorthEast（）; 
 var SW = bounds.getSouthWest（）; 
 // North West 
 var NW = new google.maps.LatLng（NE.lat（），SW.lng（））; 
 //东南
 var SE = new google.maps.LatLng（SW.lat（），NE.lng（））; 
  

示例小提琴

代码段：

var geocoder; var map; function initialize（）{var map = new google.maps.Map（document.getElementById（ map_canvas），{center：new google.maps.LatLng（37.4419，-122.1419），zoom：13，mapTypeId：google.maps.MapTypeId.ROADMAP}）; google.maps.event.addListenerOnce（map，'bounds_changed'，function（）{var rectangle = new google.maps.Rectangle（{bounds：map.getBounds（）}）var bounds = rectangle.getBounds（）; var NE = bounds.getNorthEast（）; var NEmark = new google.maps.Marker（{map：map，position：NE，title：NE}）; var SW = bounds.getSouthWest（）; var SWmark = new google.maps。标记（{map：map，position：SW，title：SW}）; // North West var NW = new google.maps.LatLng（NE.lat（），SW.lng（））; var NWmark = new google.maps.Marker（{map：map，position：NW，title：NW}）; //东南var SE = new google.maps.LatLng（SW.lat（），NE.lng（））; var SEmark = new google.maps.Marker（{map：map，position：SE，title：SE}）; var polygon = new google.maps.Polygon（{map：map，paths：[[NE，NW， SW，SE]]}）; map.setZoom（map.getZoom（） - 1）;}）;} google.maps.event.addDomListener（window，l oad，initialize）;

html，body，＃map_canvas {身高：100％;宽度：100％; margin：0px; < script src =https：//

How do you get 4 vertex coordinates from gmaps RECTANGLE (Overlay)?

I can get only NE and SW lat long from selectedShape.getBounds()

I need a 4 vertex rectangle to post-process check in MySQL php functions.

解决方案

NorthWest = NorthEast Lat , SouthWest Lng

SouthEast = SouthWest Lat , NorthEast Lng

var bounds = rectangle.getBounds();
var NE = bounds.getNorthEast();
var SW = bounds.getSouthWest();
// North West
var NW = new google.maps.LatLng(NE.lat(),SW.lng());
// South East
var SE = new google.maps.LatLng(SW.lat(),NE.lng());

example fiddle

code snippet:

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  google.maps.event.addListenerOnce(map, 'bounds_changed', function() {
    var rectangle = new google.maps.Rectangle({
      bounds: map.getBounds()
    })
    var bounds = rectangle.getBounds();
    var NE = bounds.getNorthEast();
    var NEmark = new google.maps.Marker({
      map: map,
      position: NE,
      title: "NE"
    });
    var SW = bounds.getSouthWest();
    var SWmark = new google.maps.Marker({
      map: map,
      position: SW,
      title: "SW"
    });
    // North West
    var NW = new google.maps.LatLng(NE.lat(), SW.lng());
    var NWmark = new google.maps.Marker({
      map: map,
      position: NW,
      title: "NW"
    });
    // South East
    var SE = new google.maps.LatLng(SW.lat(), NE.lng());
    var SEmark = new google.maps.Marker({
      map: map,
      position: SE,
      title: "SE"
    });

    var polygon = new google.maps.Polygon({
      map: map,
      paths: [
        [NE, NW, SW, SE]
      ]
    });
    map.setZoom(map.getZoom() - 1);
  });
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>

这篇关于如何从gmaps RECTANGLE（Overlay）获取4个顶点坐标？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！