javascript - Google Maps, Ellipse inside rectangle bounds -
i'm using great google maps shapes library draw ellipses on map 4 given points, trouble ellipse breaking boundaries of "rectangle/square" envisaged.
[edit- updated image]
see graphic example of how it's breaking boundaries:
the pink points bounding rectangle want (ignore green ones)
how keep ellipse inside bounds (the goal here being matches outer reaches of blue/gree , orange line originating centre.)
[edit]
the placement of some markers these change depending on user input
_s.oval_markers = [ // top new google.maps.latlng(51.583487043925224, -0.16044229844476376), // right new google.maps.latlng(51.58339184515312, -0.16013348842307096), // bottom new google.maps.latlng(51.58317916077958, -0.16026707625337622), // left new google.maps.latlng(51.583331361647325, -0.16064041535150864) ];
the code i'm using create oval (modified posting clarity of variables)
var b = new _g.latlngbounds(); _s.oval_markers.foreach(function (m) { b.extend(m); }); var major_axis = _gs.computedistancebetween( b.getnortheast(), new _g.latlng( b.getsouthwest().lat(), b.getnortheast().lng() ) ) / 2; var minor_axis = _gs.computedistancebetween( new _g.latlng(b.getcenter().lat(), b.getsouthwest().lng()), new _g.latlng(b.getcenter().lat(), b.getnortheast().lng()) ) / 2;
your minor axis calculation wrong. right now, you're making ellipse pass through 4 points. instead of doing this, need compute distance between edges. in other words:
var minoraxis = _gs.computedistancebetween(_m[1], _m[3]); var majoraxis = _gs.computedistancebetween(_m[1], _m[2]);
(assuming 1 vertex connected 2 , 3)
this give smaller axis lengths, looking for. next step define orientation of it. have never drawn ellipse in google maps, won't able on one.
http://mathworld.wolfram.com/ellipse.html useful ellipse info, way, including list of formulas bound eclipses various shapes.
Comments
Post a Comment