Places: Cluster View

[red-avtovo]

Thank you very much for the project! I really enjoy using it.

I would like to notice, that it would be useful to group photos on a small scale which are very close to each other or let to open cluster view (similar as a moments view) and show the subset of photos from the place, clicked on. It is not very easy to navigate through the subset of the photos or share a group of them from a specific place

[shawnbarton]

I came here to make this exact suggestion. This is an important feature to me since without it the "Places" feature doesn't have any real use in a large library. Keep up the great work.

Edit: Attached is a more extreme example (low image quality intentional). In this example "places" still shows individual bubbles for thousands of images at a "street-level" zoom. As described above, I would like to, at some (maybe configurable) zoom level, be able to see an overview of all the images in that place.

[lastzero]

Thank you very much! It's true that we need to optimize this further. As you might have noticed, the maps already cluster automatically - but only up to a certain zoom level as you otherwise might not be able to see individual photos. It's more work to handle situations as this, e.g. by showing a "stack" that then opens in the photo viewer like stacks in regular search results.

[magnuznilzzon]

I suspect it is pretty common to have the situation that @shawnbarton has, especially people with families will have a ton of pictures centered on their home. I know I do, that is how I found this thread.

[el-tiuri]

Great idea! I like the way it’s implemented in iOS’ Photos app, and this would be pretty similar. The way it works on iOS is that it dynamically creates stacks of photos that are close together relative to the zoom level, and if you tap on a stack you get a grid of all the photos in that stack.

I especially like this because it enables you to easily see all the photos you took in a particular place (regardless of scale - could be a city, could be a continent) regardless of when you took it.

I think limiting the automatic clustering functionality to low zoom levels would be a bit limiting compared to the use it could have, and I don’t really see the benefit of it compared to enabling it on all zoom levels.

Let me know if you want me to share some screenshots of the iOS photos app, in case that’d be helpful.

[ohthehugemanatee]

I have the same issue. We in fact already have the dynamic stacks. Just when you click/tap on a circle with a number of photos, that should take you immediately to a pre-filled search results page. That would be plenty. Users can zoom in closer with the plus/minus keys and get more precise, smaller stacks.

[fivestones]

I agree with @ohthehugemanatee. Right now the circles with the number inside just zooms in when clicked. Instead, clicking on these circles should open a search results page with all those photos shown. Zooming in on the map is easily done other ways and doesn't need to be done by clicking on the circles that have numbers inside.

Without the ability to view a search result for a group of photos in a particular location, the maps view is not very useful. For example, it would be really great to be looking at a photo, and easily see all my other photos from the same location or that were taken nearby as a search result. Right now I can go to the location of a photo on the map, but can't just see other photos in the same location without zooming all the way in, and then the other photos are only visible as little circles until I click on each one individually. Another example use would be to just show all the photos taken in, for example, Africa. Or the Grand Canyon. Or Paris. Or my home street. Again, I can find these photos if I look on the map, but only by zooming all the way in to see individual photos and then clicking on each one. If I have a small circle over Africa that says "27", I should be able to just click it and see all those 27 photos taken in Africa in a search result.

[lastzero]

To see the photos in regular search results, you can also type the name of the location in the regular search field, for example "Africa". Changing the view type between map and cards / list view causes a lot of load in the front and backend. For this reason, you typically don't want to jump back and forth all the time.

[fivestones]

Being able to search for a location and see photos taken there is great. Thanks! I didn't know about that.

But as for the map view, what's the point if you can't click on a location and see all the photos in that location? I do this all the time on my iPhone--I'm looking for a particular photo, don't know quite when it was but I know where I was. Go to the map view in the photos app, zoom in until I'm only seeing photos in the area I know the photo was taken, tap on that indicator for a bunch of photos, and there I have all those photos to scroll through, just from that location. It's great, I can do it on a location as big as a continent or as small as my house, and it's very quick--takes make 10 seconds to find a specific photo this way.

It makes sense that a map view in a photos app would work this way, and then whatever load in the front and backend that it causes could be worked on.

[graciousgrey]

It makes sense that a map view in a photos app would work this way, and then whatever load in the front and backend that it causes could be worked on.

@fivestones We will find a nice solution when we find time to work on this :)

[alber70g]

I have an idea on how to do this:

We could split the circle in a upper and bottom half.
Upper half: shows a + that the user can tap/click and it'll zoom (current behaviour)
Lower half: shows the number of pictures in that area that the user can tap/click that takes the user to a album view of those pictures

[ttimasdf]

As for zooming, on desktop we can use mouse scrolls, on mobile device we can use two-finger gestures. Clicking on the circle could be used to browse all the photo inside the whole group. It's rather intuitive.

Here's a screen record from Huawei Gallery app, may be a good reference i think?

4158cfdd5453bcb689bf3cb9cfbce19d.mp4

[fivestones]

I agree, there is no need for any clicking/tapping on the numbers to be a zoom option. We can just zoom with two fingers or mouse scroll.
I'd love to see it look like in the above Huawei Gallery app.

[lastzero]

Huawei uses local images in a native app. We use thumbnails with a responsive Web UI that must be fast and work on all browsers and devices. So it's a tiny bit more complicated.

[fivestones]

I suppose it is. But to change from the current, not very useful behavior (zooming in when clicking on a number) to a very useful behavior (showing a search result of all the photos in that area when clicking on the number) should be a super easy change to make. The photos in that area have already been found in the database, which is how we know how many there are. We just need the link to go to a display of all of those particular photos.

If we want to zoom, we can already do that without clicking on the numbers.

To show a photo, just pick the first one out of all those represented by a number, and show it there. Already when you zoom in until only a single photo is on a particular place on the map, that photo is shown. So it shouldn't be hard to show that same number to represent a bunch of photos in a more zoomed out view.

[heikomat]

No promises, but maybe I'll try creating a POC for this feature on the weekend

[heikomat]

Had a couple hours today. This is the current progress:

• implement that pictures are always clustered, no matter the zoom level
• implement showing the photos of a cluster (not actually 100% exact, but good enough)

Still a lot to do (its rough around the edges, has no tests etc), but it proves that it's doable.

See #2596

Screen.Recording.2022-08-07.at.01.23.18.mp4

[svengreb]

@heikomat That already looks great for a POC, well done!
I'd like to throw in a small improvement suggestion: Instead of showing only numbers it would be nice to use a photo of this cluster instead as "background". This way it would be easier to quickly find what you are looking for instead of having to click on each cluster in an area when you are not quite sure if it was really taken at this specific location.
The number could be shown either as overlay or maybe we can introduce a new variant implementation of the cluster circle component that can have a small "badge" outside of the circle that contains the number. The second option would be great to prevent contrast issues of the number when the "background" photo has the same color like the font.

To allow users to change this behavior we can make this customizable through new setting keys, e.g. to make it possible to select a specific criteria which image will be used as "background" (latest photo, most viewed etc.) and, of course, disable the feature to only show numbers instead like already possible in your POC.

[ttimasdf]

Instead of showing only numbers it would be nice to use a photo of this cluster instead as "background". This way it would be easier to quickly find what you are looking for instead of having to click on each cluster in an area when you are not quite sure if it was really taken at this specific location.

@svengreb This idea has already been considered by project developer. So, no hurry 😉

Huawei uses local images in a native app. We use thumbnails with a responsive Web UI that must be fast and work on all browsers and devices. So it's a tiny bit more complicated.

[heikomat]

All photo IDs of a cluster are known when the cluster is rendered.

Showing A photo of a cluster is not a problem I think. Showing a photo based on some criteria would be more difficult.

The map already renders custom elements for single images.
Rendering a different custom element, for example with a counter attached in a little bubble, should be no problem as far as I can tell.

[heikomat]

I hope no one waiting for this feature is in a hurry.
I'd really like to spend another night or two developing this, but time is tight in the coming days/weeks.
With some luck I'll have some free time at the end of next week

[Istria1704]

I found this thread just before I almost opened a new one about the same thing. Very nice it is being worked on!

I also agree that there should be a way to "show all photos in cluster".
If the zooming function is simple replaced by it, I'd be fine with that. But maybe something like double-tapping is possible to keep both functions? That could work universally on both desktop and mobile, no?

[heikomat]

I'm slowly but surely making progress whenever i find some free time.
In it's current state

• the cluster-dialog now has a sticky header with a close-button
• it can be closed via back-button

I tried making the dialog fullscreen on screens with < 600px of width, but that somehow breaks closing it?
For now, having it not-fullscreen isn't to bad, even on mobile devices.

a known issue is, that opening a cluster currently resets the search if a search-term was entered.
Other than that, and a lot of testing and a little cleaning up, the only missing thing afaik is implementing better custom-elements to be rendered on the map (something like maybe the first 4 images in a cluster with an outside bubble displaying the image count)

[heikomat]

current progress. What do you think about the squared rectangles instead of circles (to see more of the images), and borders and counter bubbles?

[svengreb]

The count badge/bubble is nice and definitely better that just a one-colored circle without an image preview!
Showing multiple image previews is also a nice idea, but it should be opt-in since the images are really small and maybe a single image might be preferred. Adding this as an option to the settings would be really great.

[lastzero]

The new thumbnails on the map look great! As for the overlay, I haven't had enough time to think about it and didn't want to start a discussion based on unfinished work. An alternative could be to display the images at the bottom with horizontal scrolling, similar to Google Maps and other services. Of course, not so many images would be visible there at the same time and it would require developing yet another view.

[lastzero]

Same view with a light theme (Lavender):

[heikomat]

This refactor looks pretty cool, well done @lastzero!

[lastzero]

We'd love to release this on Friday! Everything looks good to me now, except for a missing resize handle so you can adjust the size of the cluster preview:

That being said: If you want to help with testing, now would be a great time! 🥳

[lastzero]

Final screenshot with the map style selector and places cluster view open (the distance scale, also new, is hidden behind the overlay in this case, but I don't think that's a good enough reason to move it to the top):