Openfoodnetwork: Enterprises in the same address get overlapped in map

[sauloperez]

When multiple enterprises have the same address, it's impossible to find them all in the map. Their markers get totally overlapped hiding all enterprises but the last one that was created.

At maximum zoom other markers don't show up:

So, can only click the last one of them:

And the angular's enterprises collection correctly lists them with the same coordinates:

{
  "name":"Cervesa Capfoguer, SCCL",
  "id":31,
  "description":"Cooperativa de producci\u00f3 i distribuci\u00f3 de cervesa artesana",
  "latitude":41.4461847,
  "longitude":2.2087712,
  ...
},
{
  "name":"Cooperativa de Consum El Cab\u00e0s (Ca la Sisqueta)",
  "id":30,
  "description":"",
  "latitude":41.4461847,
  "longitude":2.2087712,
  "long_description":"Cooperativa de consum de fruita i verdura ecol\u00f2gics. Ens trobem un cop per setmana a Ca la Sisqueta per recollir les nostres comandes.",
  ...
}

We need to add some spacing between them so that all markers in the same coordinates are clickable.

[enricostano]

https://stackoverflow.com/questions/14248365/how-to-render-multiple-markers-at-the-exact-same-coordinates-in-google-maps-api

maybe?

[sauloperez]

Perhaps it's better to allow users to introduce latitude and longitude manually to fix these cases but that might involve more work than a pure JS solution.

[Morantron]

hey guuuys

[Morantron]

Looks like google maps has some clustering options thingies

( still need to center the marker image properly :sweat_smile: )

Maybe the modal when clicking on a marker can be expanded to showing more than one ( in the case of having many in the _exact same location_ )

[sauloperez]

Awesome having you onboard @Morantron 💪 !

Maybe the modal when clicking on a marker can be expanded to showing more than one

definitely, that's the other challenge besides the marker

[Morantron]

That's already done in the linked PR

[enricostano]

Should we close this @sauloperez ?

[sauloperez]

I wouldn't. The problem still exists, although it's not our priority now.

Perhaps a better approach would be to slightly separate the markers depending on the zoom level as Google Maps does. We need to check whether the API supports that as well.

[sauloperez]

Moved to: https://community.openfoodnetwork.org/t/enterprises-in-the-same-address-get-overlapped-in-map/1157

[RachL]

Reopening for the upcoming UK dehack

[lin-d-hop]

Closing

[RachL]

@lin-d-hop why was this closed? I can still reproduce it and I believe it 's a good first issue

[kirstenalarsen]

is this an issue or not an issue @lin-d-hop @RachL ?

[rmklaus12]

Still an issue, yes? Happy to grab this one as my first attempt (the browser back buttons) was a bit much as a first issue!

[RachL]

@rmklaus12 yes this is still an issue!

[sauloperez]

I'm not sure the requirement are clear for this issue. Last time we worked on it, it was rejected. See https://github.com/openfoodfoundation/openfoodnetwork/pull/1786#issuecomment-336354416

[Matt-Yorkley]

I had a rummage in the code for this recently, and I think there's some configurable options in the javascript plugin for handling these "clustering" issues...

[manvil]

Hello everyone monitoring this , I am beginning to work on this, FYI