Google Map Android and iOS Xamarin: Create Close Polygon on random tapped coordinates

Question

Im using Google Map on Xamarin Android and iOS

Im trying to create a close polygon from random tap coordinates.

Android like:

var options = new PolygonOptions();
                        options.InvokeFillColor(int.Parse("80000000", System.Globalization.NumberStyles.HexNumber));
                        options.InvokeStrokeColor(int.Parse("000000", System.Globalization.NumberStyles.HexNumber));
                        options.InvokeStrokeWidth(2);
options.AddAll(listOfPosition); //list of tapped coordinates
googleMap.AddPolygon(options);

iOS like:

var polygon = new Polygon();
                    polygon.Path = path; // this is my list of tapped coordinates
                    polygon.StrokeWidth = 2;
                    polygon.StrokeColor = UIColor.Black;
                    polygon.FillColor = UIColor.FromRGBA(0, 0, 0, 0.3f);
polygon.Map = mapView;

Let say I have tapped coordinates randomly like this :

Debug|LOCATION:: 37.9115841998119 : -122.566957734525
Debug|LOCATION:: 37.9117754470967 : -122.561504803598
Debug|LOCATION:: 37.9085008969633 : -122.566276118159
Debug|LOCATION:: 37.9086561762004 : -122.562640719116
Debug|LOCATION:: 37.9102216477146 : -122.561550065875
Debug|LOCATION:: 37.9098513127501 : -122.567805983126
Debug|LOCATION:: 37.9123967989511 : -122.564518935978

How can I make it close polygon without intersecting lines inside even may tap coordinates reached 100 position data.? Any Idea or Computation? Thanks advance..

Mani · Answer 1 · 2017-07-21T01:58:04.767

1

You don't have to compute locally, Use Shapes API of Google maps

To sort the points locally for closed polygon

https://stackoverflow.com/a/7369943/2700586

Reference: http://geomalgorithms.com/a10-_hull-1.html

edited Jul 21 '17 at 01:58

answered Jul 21 '17 at 00:55

Mani

2,599
4
30
49

I already do the api.. the problem is how can make it close polygon on random coordinates tapped.. it intersect each line depends on location sorting.. – Rai Jul 21 '17 at 01:00
You have to use PolygonOptions not the polygon, itself – Mani Jul 21 '17 at 01:06
I use PolygonOptions for Xamarin android. above code is for xamarin iOS google map version – Rai Jul 21 '17 at 01:07
Refer this https://stackoverflow.com/questions/15615996/how-to-draw-filled-polygon-in-google-maps-sdk-for-ios – Mani Jul 21 '17 at 01:11
thanks but doesn't help much.. I need some computation to connect all position dots into close polygon something like sorting the list of coordinates on the map. . – Rai Jul 21 '17 at 01:37
your edit answer seems nice ref: https://stackoverflow.com/a/7369943/2700586 gonna take a study and try thx – Rai Jul 21 '17 at 02:06

Rai · Answer 2 · 2017-08-01T00:42:22.677

Here's the solution :)

You need to get the most Left and most Right on Lat and Lon.

get the min and max latitude.

Draw a line and seperate first the lower points and the higher points

Check points if its on higher or lower by equation of line.

public static bool CheckIsUpperCoordinate(PositionData a, PositionData b, PositionData c)
        {
            var position = Math.Sign((b.Latitude - a.Latitude) * (c.Longitude - a.Longitude) - (b.Longitude - a.Longitude) * (c.Latitude - a.Latitude));

            return position > 0 ? true : false; //true if upper , false if lower position
        }

Now sort lowerlist and upperlist by its longitude.

var lowerPosition = lowerPositionList.OrderBy(x => x.Longitude).ToList();
var higherPosition = higherPositionList.OrderByDescending(x => x.Longitude).ToList();

And connect all points from this sequence left most -> lower points list -> right most -> upper points list

path.AddLatLon(leftMost.Latitude, leftMost.Longitude);

foreach (PositionData lowerData in lowerPosition)
{
       path.AddLatLon(lowerData.Latitude, lowerData.Longitude);
}
path.AddLatLon(rightMost.Latitude, rightMost.Longitude);

foreach (PositionData higherData in higherPosition)
{
       path.AddLatLon(higherData.Latitude, higherData.Longitude);

}
path.AddLatLon(leftMost.Latitude, leftMost.Longitude);

wrap it on polygon

var polygon = new Polygon();
                    polygon.Path = path;
                    polygon.StrokeWidth = 2;
                    polygon.StrokeColor = UIColor.Black;
                    polygon.FillColor = UIColor.FromRGBA(0, 0, 0, 0.3f);
  polygon.Map = mapView;

Hope it may help someone :)

I appreciated my Math Teacher after this task. lol xd

Google Map Android and iOS Xamarin: Create Close Polygon on random tapped coordinates

2 Answers2