I am using google map api to draw a polygon and 4 holes inside of it, three holes are working fine but the fourth one is rendering like shaded polygon Below is the defined code i am using to create polygon
const paths = [_coordinates];
const holes = JSON.parse(coordinate_holes);
console.log("here is the coordinates",isClockwise(JSON.parse(zone_coordinates)));
holes.map(hole => {
paths.push(shortLatLng(hole).reverse())
});
Passing path to JSX
if(shape==="polygon") {
return (
<div key={id}>
<Polygon
paths={paths}
options={getOptions(shape)}>
</Polygon>
{infoBox(zone)}
</div>
)};
Not Working holes
[
{
"latitude":39.7398066162147785007618949748575687408447265625,
"longitude":-104.9892461299896098125827847979962825775146484375
},
{
"latitude":39.73941061515532879866441362537443637847900390625,
"longitude":-104.989743344485759735107421875
},
{
"latitude":39.73950136559911783251664019189774990081787109375,
"longitude":-104.98886726796627044677734375
}
],
Working Holes
[
[
{
"latitude":39.74007319377148661487808567471802234649658203125,
"longitude":-104.99013327062129974365234375
},
{
"latitude":39.74009794366639880536240525543689727783203125,
"longitude":-104.9895716831087923992527066729962825775146484375
},
{
"latitude":39.7396276941428965301383868791162967681884765625,
"longitude":-104.989925734698772430419921875
}
],
[
{
"latitude":39.7399659441241084323337418027222156524658203125,
"longitude":-104.9889316409826136577976285479962825775146484375
},
{
"latitude":39.74006236568965277911047451198101043701171875,
"longitude":-104.98836301267147064208984375
},
{
"latitude":39.73964703012405408344420720823109149932861328125,
"longitude":-104.988613128662109375
}
],
[
{
"latitude":39.7396194441226242588527384214103221893310546875,
"longitude":-104.98831272125244140625
},
{
"latitude":39.740045865752193776643252931535243988037109375,
"longitude":-104.9878191947937153827297152020037174224853515625
},
{
"latitude":39.739454443509572456605383194983005523681640625,
"longitude":-104.9878228828311108600246370770037174224853515625
}
]
]
problem is only happening in some of the cases and I am unable to figure out what is the reason behind it, I already checked that the outer region is clock-wise and the inner holes are anticlockwise please help if you can thanks
