Question

我的项目是为在线业务创建区域管理模块。

企业所有者/管理员可以通过在Google地图上将其绘制为POLYGONS来创建新区域。

我可以绘制多边形，在它们之间选择获取坐标并保存它们没有任何问题。

然而，当我尝试获取存储在数据库中的现有坐标并在屏幕上绘制它们时，它们会被正确渲染，但我无法选择它们。

我一直在使用谷歌的代码示例来测试功能。

我用来绘制现有坐标的代码是

var triangleCoords = [
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.75737),
new google.maps.LatLng(25.774252, -80.190262)
];

// Construct the polygon.
bermudaTriangle = new google.maps.Polygon({
paths: triangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35
});

bermudaTriangle.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

我使用绘图管理器在屏幕上绘制多边形的代码也来自Google样本

function initialize() {
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(22.344, 114.048),
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      disableDefaultUI: true,
      zoomControl: true
    });

    var polyOptions = {
      strokeWeight: 0,
      fillOpacity: 0.45,
      editable: true
    };
    // Creates a drawing manager attached to the map that allows the user to draw
    // markers, lines, and shapes.
    drawingManager = new google.maps.drawing.DrawingManager({
      drawingMode: google.maps.drawing.OverlayType.POLYGON,
      markerOptions: {
        draggable: true
      },
      polylineOptions: {
        editable: true
      },
      rectangleOptions: polyOptions,
      circleOptions: polyOptions,
      polygonOptions: polyOptions,
      map: map
    });

    google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
        if (e.type != google.maps.drawing.OverlayType.MARKER) {
        // Switch back to non-drawing mode after drawing a shape.
        drawingManager.setDrawingMode(null);

        // Add an event listener that selects the newly-drawn shape when the user
        // mouses down on it.
        var newShape = e.overlay;
        newShape.type = e.type;
        google.maps.event.addListener(newShape, 'click', function() {
          setSelection(newShape);
        });
        setSelection(newShape);
      }
    });

    // Clear the current selection when the drawing mode is changed, or when the
    // map is clicked.
    google.maps.event.addListener(drawingManager, 'drawingmode_changed', clearSelection);
    google.maps.event.addListener(map, 'click', clearSelection);
    google.maps.event.addDomListener(document.getElementById('delete-button'), 'click', deleteSelectedShape);

    buildColorPalette();
  }
  google.maps.event.addDomListener(window, 'load', initialize);

由于我使用的功能在多边形检查中使用绘图管理器检查叠加完成，

google.maps.drawing.OverlayType.POLYGON

我无法选择使用

绘制的多边形

google.maps.Polygon

所以tldr

1）如何检查我是否在谷歌地图上选择了多边形？

OR

2）如何使用图纸管理器绘制预定义的多边形点？

感谢。

Answer 1

向您的多边形添加一个click事件监听器并获取其路径：

google.maps.event.addListener(bermudaTriangle, 'click', function () {
    var polygonPaths = this.getPaths();
});

检查记录的Polygon methods and events。

在Google Maps V3上选择多边形

1 个答案: