one we draw polygon on map by dropping points; it results into broking it's shapeliness when points are moved in an uncertain way.

---

🚨🚨🚨

• I have tested it on all devices
• attached code sample, video and screenshot from official document draw tool

🚨🚨🚨

---

Describe the bug
User drops some point on map. When user drops 3 points I am completing drawing resulting the polygon shape on map. If points are too far away from each other I am adding one sub point into it to help polygon drawing. Some validations are completed by turf. But moving points randomly resulting into broken boundaries. Sometimes just zooming in-out fixes the polygon drawing automatically. How can I fix it.

To Reproduce
I tried same with Mapboxgl-draw tool/doc. here also moving points randomly resulting to some unknown boundaries which is not a part of drawing.

I have attached the code sample.

Example:

removing code as issue has been closed {Its not fixed yet}

Example to call above component: Here newField is just a object which will have polygon coordinate into it when drawing completed.

 <DrawFieldOnMap data={newField} propertyDetail={selectedProperty} fieldListArray={fieldList} />

Expected behaviour
Polygon on map should not broke boundaries or add any predicted colour shape line.

Actual behaviour
Moving points randomly broke the shape-line of polygon but fill layer colour is visible

Screenshots

https://user-images.githubusercontent.com/67738198/151915366-bc666f93-3b0c-4031-a929-5905e7037346.mp4

{the attached screenshot is from mapbox document. In the screenshot check the area annotated with black arrow, there you will find yellowish background without shapeline either it is not part of polygon. Please find the attached video for detaile explanation of issue. }

Versions (please complete the following information):

• Platform: Android, iOS
• Device: any device
• Emulator/ Simulator: yes
• “@react-native-mapbox-gl/maps”: “8.2.0-beta2” (tested with some other versions too but issue exists)
• React Native Version- 0.63.3

Additional context
Sometimes drawing fixes automatically if user zoom-in/out 2-3 times. Or else if I am doing something wrong please can anybody post similar answer for drawing polygon on map, move it’s point to adjust drawing once completed and editing feature .

[samiksha-syn]

what exactly you want ? you want to create drawing on map or are you looking for this broken boundaries issue fix ?

@SanjanaTailor

[SanjanaTailor]

what exactly you want ? you want to create drawing on map or are you looking for this broken boundaries issue fix ?

@SanjanaTailor

@samiksha-syn : I am looking for the both things. I am highly dependent on this to implement in React native POC. I saw you have achieved it and there’s nothing wrong if you can connect me or shall I connect with you and where ? It will be more helpful. so that I am replying and tagging you.