与多边形

Question

我试图让谷歌地图API的Javascript从JSON取分，并使用computeOffset（）函数来计算左，右，这样我可以积使用多边形的路径点谷歌地图的JavaScript制作路径。我目前的代码似乎只是制造奇怪的形状，而不是从点到点进行干净的多边形连接。

我定义VAR lastPoint作为lastPoint从jQuery $。每个循环，这样，当查询转到下一个纬度经度值多边形将连接到以前的点。而不是从点到点的漂亮的方形多边形我得到奇怪的形状，主要是三角形而不是正方形。

$.getJSON('sixth.json', function(data) { 
    var lastPoint; 
    var myLatlng2; 
    var polyShape; 

    $.each(data.contactdetails, function(i, value) { 
    myLatlng2 = new google.maps.LatLng(value.lat, value.lng); 

    var boomwidth = value.boomwidth; 
    var bear = value.bear; 
    var boomconversionfactor = 1; 

//computeOffset returns a LatLng position by using the bearing and number of feet to return another location 
    var point1 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear + 90); 
    var point2 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear - 90); 
    var point3 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, 90 + bear); 
    var point4 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear - 90); 

    if (lastPoint !== undefined){ 
     var point1 = google.maps.geometry.spherical.computeOffset(lastPoint, (0.30480 * boomwidth * boomconversionfactor)/2, bear + 90); 
     var point2 = google.maps.geometry.spherical.computeOffset(lastPoint, (0.30480 * boomwidth * boomconversionfactor)/2, bear - 90); 
    } 

    var Coords = [point1,point2, point3, point4]; 

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

    polyShape.setMap(map); 

//assign lastPoint the lat lng value from the jQuery loop. Trying to connect previous position to next by placing the lastPoint outside the loop. 

    lastPoint = myLatlng2; 

    }); //close of .each jQuery loop 




}); 

这是json包含的内容。当我使用标记提醒或情节时，地图上的位置显示正确。

JSON

这里是一个图像。而不是干净地关闭多边形，我得到这些三角形的块。

Answer 1

如果轴承小于90点到左在computeOffset（）方法的多边形不会工作，因为computeOffset（）只需要0-360轴承从0开始和去从北部顺时针旋转因此，如果轴承小于90，则只需取360并添加轴承--90。如果轴承大于270则取轴承+90并减去360.

以下代码将使多边形围绕路径：

var bear2; 
    if(bear>270){bear2 = (bear + 90) - 360;} else{bear2 = bear + 90;} 
    var bear3; 
    if(bear<90) { bear3 = 360 + (bear -90);} else{bear3 = bear - 90;} 


    var point1 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear2); 
var point2 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear3); 
    var point3 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear2); 
    var point4 = google.maps.geometry.spherical.computeOffset(myLatlng2, (0.30480 * boomwidth * boomconversionfactor)/2, bear3); 

     if (lastPoint !== undefined){ 
    var point1 = google.maps.geometry.spherical.computeOffset(lastPoint, (0.30480 * boomwidth * boomconversionfactor)/2 , bear3); 
var point2 = google.maps.geometry.spherical.computeOffset(lastPoint, (0.30480 * boomwidth * boomconversionfactor)/2, bear2); 

     } 

0.30480 * boomWidth * boomconversionfactor只是以英尺为单位放置多边形的宽度。使用布尔值和if语句，可以将boomconversionfactor设置为1（使其保持为英尺）或3.28（对于米）。因为宽度取决于左边和右边的距离，所以使用二分之一。

多边形现在的样子：