impress-org / google-maps-builder

One Google Maps plugin to rule them all. Google Maps Builder is intuitive, sleek, powerful and easy to use. Forget the rest, use the best.
https://wordpress.org/plugins/google-maps-builder/
32 stars 9 forks source link

When multiple markers with exact same location, group items in the infowindow #247

Closed mathetos closed 7 years ago

mathetos commented 7 years ago

Users often have use-cases for having more than one location in the same exact geographic location. When that happens with Maps Builder, it's impossible for the visitor to click on the different markers because they are simply stacked one on top of the other.

@topher1kenobe has a simple solution that groups the multiple items into the infowindow, as seen here: image

He's sent me a copy of the code that does this as a reference.

mathetos commented 7 years ago

@kevinwhoffman Here's an example functionality plugin from @topher1kenobe and how he implemented this on the HeroPress site: https://drive.google.com/open?id=0B316iT51Mzhmc3NNSTRnWUpNTFZkdjN2UVFaYS16QWY1RlQ0

kevinwhoffman commented 7 years ago

@I do agree this would be a helpful addition to GMB. Here's what I've found in comparing GMB's approach to the HeroPress plugin.

The HeroPress plugin is using the Place ID to group posts from the same location. First a WP_Query retrieves the posts, then an array is built using the Place ID as the key. In doing so, any posts that share the same Place ID will be placed under the same key.

There is a key difference in the way GMB fetches info window content vs. the HeroPress plugin:

GMB retrieves info window content on demand via AJAX. In contrast, the HP plugin fetches all info window content upfront in order to build the associative array. This means all post meta is fetched and placed into the array before the page renders.

Possible Solution

It's possible that we could associate multiple posts with a marker and still get that content via AJAX.

  1. Build an array of Place IDs as the array of markers is being built.
  2. Before a marker is added, check to see if its Place ID already exists. If it does, then don't add the marker. This ensures duplicate markers are not added.
  3. When a marker is clicked, retrieve post content for any posts that contain that Place ID in post meta.
  4. Then we need to make sure that content is styled appropriately.
mathetos commented 7 years ago

I'm wondering if we couldn't make this more of a manual process. Basically, every marker gets added as a metabox field to the post. What if we just added a "group this marker" checkbox to it's instance in the UI, then a simple text field is added to name that group. Then you would do the same for all other markers and give them the same name to be grouped.

Naturally if we could save the group names kind of like Tags are saved in WP Posts, then they could autopopulate and be chosen with a click that would prevent markers not being grouped because of a typo. But that might be a second iteration of a basic feature here.

How they are grouped in the frontend is a different question all together.

kevinwhoffman commented 7 years ago

There would still be the issue of setting the coordinates of said group. For example, which of the posts in the group do you use for location? Does the group itself have a location? The complexity could snowball quickly.

I recommend basing shared markers on the Place ID like Topher did because the Place ID has inherent coordinates associated with it. We should be able to make that work without increasing the complexity to the UI.