GoMap icon indicating copy to clipboard operation
GoMap copied to clipboard

Take pictures and upload to panoramax.mapcomplete.org

Open tordans opened this issue 1 year ago • 8 comments

MapComplete always had a focus on collecting Pictures of OSM Objects. They used IMGUR until recently, when they switched to a special Panoramax Instance that is only used to handle pictures from the app.

Panoramax is an open source, federated Mapillary-like service.

More on the MapComplete news at https://en.osm.town/@MapComplete/113209991694821771

I think it would be a great addition to GoMap to allow storing geo referenced pictures.

  • Use Case 1: Add pictures to OSM objects Users could take pictures, upload them to this instance and connect them in the data with a panoramax=* tag in one go.

  • Use Case 2: OSM Notes A second use case would IMO be to allow picture uploads as part of the "add note" UI where I write a note like "check tags based on traffic sign (picture) and road markings (pictures)"


@pietervdvn would it be possible to allow GoMap (or StreetComplete) to upload pictures to your instance as well? What would the requirements be?


Ping https://github.com/pietervdvn/MapComplete/issues/1451

tordans avatar Oct 23 '24 13:10 tordans

It is @thibaultmol whom hosts the server and who thus has to decide this.

I don't see a reason why not, except the disk usage (but that shouldn't be a problem)

pietervdvn avatar Oct 23 '24 15:10 pietervdvn

I think it's probably best to keep separate instances for each app. To help with moderation and such. (it's just separate docker containers on the vm I have). I don't mind looking into this yeah.

Did promise to put the main OSMBE instance up for the longest time, so probably going to prioritize that first unfortunately.

thibaultmol avatar Oct 23 '24 20:10 thibaultmol

  • (ref: https://github.com/streetcomplete/StreetComplete/issues/5939)

mnalis avatar Nov 13 '24 12:11 mnalis

Such option would be really great. I'm wishing a kind of photomapping object's that do not have any picture tag : wikimedia, picture, panoramax, mapillary ... By this quest it would be a specific rendering for picture hunting for quality displaying.

Wikimedia did a specific website for this idea : wikishootme image

9 years ago I asked to get a specific app Flickr4osm created by Pierre Giraud https://github.com/pgiraud/flickr4osm

JLZIMMERMANN avatar Dec 15 '24 17:12 JLZIMMERMANN

A few questions:

  • Why does MapComplete use its own instance of panoramax instead of using panoramax.openstreetmap.fr?
  • Does the user need to create an account on the panoramax instance before uploading? Is every photo associated with a user?
  • Is there the expectation that users will be able to review and organize their photos inside the app?
  • Who is responsible for content moderation?

bryceco avatar Feb 18 '25 21:02 bryceco

* Why does MapComplete use its own instance of panoramax instead of using panoramax.openstreetmap.fr?

Because the idea behind Panoramax is to spread out the servers so it's not centralized on one server.

* Does the user need to create an account on the panoramax instance before uploading? Is every photo associated with a user?

The way we did it with the Mapcomplete instance was the quick and dirty way of just having one user account and then using that login token for all uploads. In the actual image metadata it'll say Mapcomplete as it's author but besides that it will show the osm username. it's not ideal, but it was a quick way of implementing it. @Zverik has been working on a different solution so that the osm login you use for (in your case gomap) could be used to auth on the panoramax instance as well. for example.

* Is there the expectation that users will be able to review and organize their photos inside the app?

If you are referring to managing their photos on the panoramax instance? with our method: no. Because they're all on one user account. Again, not ideal.

With @zverik's approach they would be able to do that.

* Who is responsible for content moderation?

Me and pieter. Currently if an image gets reported, it automatically gets hidden. Until someone acts upon it. Currently moderation is kind of rough because there is no proper ui for it. But yeah

thibaultmol avatar Feb 18 '25 22:02 thibaultmol

Is there the expectation that users will be able to review and organize their photos inside the app?

I meant inside of Go Map!! If a user takes a bunch of pictures and then wants to scroll through them, maybe delete some. Or maybe check if other people already uploaded a photo of the same object. This is probably something @tordans needs to answer.

bryceco avatar Feb 18 '25 22:02 bryceco

Depends on the 'flow' I guess. In case of mapcomplete this wouldn't be a problem because you just click on the object and then add the image(s) (but you already see if the object has an image).

But Gomap could end up having a different flow. Not saying one is better than the other. Just explaining how they/we do it

thibaultmol avatar Feb 18 '25 22:02 thibaultmol

  • Is there the expectation that users will be able to review and organize their photos inside the app?

Panoramax is being improved with new goals : teams, organizations (such like Mapillary already doas), semantic added to pictures (IPTC + OSM tagging system) and you already may rename a sequence.

JLZIMMERMANN avatar Feb 19 '25 05:02 JLZIMMERMANN

I'm trying to figure out the scope of work. If we could just open a web page and have all the UI heavy lifting done by Panoramax then it makes things much easier and future proof.

bryceco avatar Feb 20 '25 20:02 bryceco

Personally, those are the use cases I am hoping for:

Taking a sequence of pictures

Something outside of GoMap. I ride my bike or go for a walk with the sole purpose of taking street level imagery. I use an app for that that is made for just this use case. Personally I review those before I upload to remove duplicates or weird/bad shots. (For long sequences there are multiple tools that help clean them up; I am using this one.) Those images belong in one of the main Panoramax instances, ideally of the given country. I don't think GoMap or other apps should get involved with this.

Taking pictures for notes

OSM Notes are great to discuss and shared things that are wrong or missing in OSM and pictures make them so much easier to work with. This is one of my GoMap Use Cases:

  • Open an existing OSM note > adding 1-n pictures to it. The pic is uploaded to the special panoramax instance, because it is not a sequence and a different picture style; the app uploads and adds a comment with the URLs to the pictures. I consider the custom message "comment" optional in this flow.
  • Create a new OSM note > same flow, but create the note and the comment should be required.

Complexity: Taking multiple pictures of one object / for one note will become complex fast. So maybe this should be scoped to just one pictures instead? One can always use this flow multiple times…

Adding pictures to objects

Some objects in OSM really benefit from having a picture assigned to them. Some examples:

  • Traffic signs
  • Barriers on a cycle street, like cycle barriers
  • Art/Statues/…
  • Maybe hazard=* things

(The related tags list, 2 is not helpful to find other examples, unfortunatelly)

This is the second UseCase I would love to see in GoMap:

  • On a given OSM object > At the end of the preset/tag list, use a picture button > Take a picture, upload it, add the tag to GoMap

Note: The tagging that is used for this by MapComplete is panoaramx=ID, panoramax:1=ID to work around value field size limitations. More at https://github.com/ideditor/schema-builder/issues/180

Looking at pictures on elements

With both cases – notes and OSM objects – we now need a way to look at the picture. Personally I don't see myself using GoMap to look at many pictures, that is for other workflows that likely start at home in iD or some QA tool.

But some basic way to

  • see that there is a picture added
  • have a way to look at it full screen
  • have a way to open the source URL at panoramax (this requires something that resolves the right instance or takes the meta instance every time?)
  • have a way to download the image

UI:

  • For notes, that could be a preview of the image in the UI with tab to see details.
  • For OSM objects, that could be a tiny preview next to the input field which can be tapped.

BUT, all this can become a lot of UI and the minimal thing would be to just open a web browser in the panoramax instace.

  • Notes: There is a link in the note already: That could oben an embedded browser and be done with it
  • OSM Objects: That would need a custom link icon next to the input like we have in other cases.

Looking at pictures on the map

Personally, I don't thing this an important use case. Again, I don't see myself working with the pictures in GoMap but in other tools.

The UseCase I see here would be:

  • Use the new "task" layer to hint to me where pictures are missing for use cases where I want to collect them.
  • Maybe there is a task type "picture" that will take me to the camera UI right from the task-map-pin, so I save a few clicks.

I could see myself adding tasks for all of the objects I listed above to trigger the "completeionist gene" and add pictures to all of them in my hood.

UseCases I don't see

  • Deleted pictures that I uploaded I already uploaded – I will have to log into the panoramax instance to do that or use the "delete that" links that the instances provides
  • Working with the pictures in GoMap – see above

If we could just open a web page and have all the UI heavy lifting done by Panoramax then it makes things much easier and future proof.

I am not sure if this will work nicely. The UI flow will require a back and forth which I image will be hard to implement with a web based process? How would the app get the panoramax-ID after the upload was done?

tordans avatar Feb 21 '25 05:02 tordans

How would the app get the panoramax-ID after the upload was done?

You're correct. I guess the photo-taking and upload would need to be handled app-side, but other things (viewing photos, deleting photos, etc) would be done via web page.

bryceco avatar Feb 21 '25 21:02 bryceco

In my dream usecase : a photo mapping hunting option (like treasure game). A specific layer to go anywere and show main objects that haven't yet any picture.

The first that would be shown would be tourism=* and important amenity=*...

JLZIMMERMANN avatar Feb 22 '25 08:02 JLZIMMERMANN

First cut of uploading and viewing panoramax photos is in the most recent beta release.

bryceco avatar Mar 10 '25 17:03 bryceco

@bryceco thanks a lot for adding this feature!

I tested it a bit – here is some unordered feedback.


Test 1: Mapcomplete => GoMap

Uploaded images with MapComplete in https://www.openstreetmap.org/changeset/164132059

  • Element https://www.openstreetmap.org/way/297142651 and
  • Element https://www.openstreetmap.org/node/43662888

One of the images:

  • Viewer https://api.panoramax.xyz/#focus=meta&map=17/51.957068/7.617782&pic=9435e8df-a13f-4276-b320-880a8e1b7585&speed=250&xyz=255.00/0.00/30
  • API https://api.panoramax.xyz/api/collections/6e702976-580b-419c-8fb3-cf7bd364e6f8/items/9435e8df-a13f-4276-b320-880a8e1b7585 "geovisio:image": "https://panoramax.mapcomplete.org/permanent/94/35/e8/df/a13f-4276-b320-880a8e1b7585.jpg",

Test 2: Upload via GoMap

  • Element https://www.openstreetmap.org/node/389872045
  • Viewer https://api.panoramax.xyz/#focus=meta&map=17/51.965351/7.615701&pic=f57f084b-82ae-4472-b013-d2ec4f8e2a4f&speed=250&xyz=0.00/0.00/30
  • API https://api.panoramax.xyz/api/collections/cd5507e1-d34f-47c7-9ff5-500347b76517/items/f57f084b-82ae-4472-b013-d2ec4f8e2a4f "geovisio:image": "https://panoramax.openstreetmap.fr/images/f5/7f/08/4b/82ae-4472-b013-d2ec4f8e2a4f.jpg",

Feedback

  • When I took the image with GoMap, I had to OAuth somewhere. I did not look properly where but the flow did not explain what was happening and why. It all worked but left me wondering what I just did. It's all very small and when on the go it's hard to understand what is happening. I am assuming I did an OAuth with OSM against Panoramax FR? Is that stored in GoMap or will I need to do this again next time? — Maybe there is a way to give some more Kontext before this happens the first time?

  • Image Image
    • That icon is a bug, right? Is it supposed to be two icons or one?
    • I think the "no image yet" case should start the "new image" flow right away and not open the panel first
    • What does the blue logo at the top do? I see a Panoramax Map of europe but don't know what to do with that page. Can I choose an image from there to add an existing image?
    • I think in the "no image there yet" case, there should not be a preview placeholder image but a big button to start the new image flow
    • The uploads are done to osm-fr right? I think it would be great if the apps came together and used the same instance for those non-sequence shots. The last I read is that MapComplete does not want to share it's instance. But maybe this can be talked about again…? — Update: I asked in Matrix about it.
    • Looking at images that where uploaded via MapComplete cannot be viewed AFAIK and I think it happens because you use the fr and not the xyz domain. My understanding is that the xyz domain is the (only) meta-server.
  • Image
    • For MapComplete, it would be ideal to optionally show the Exif.Image.Artist as well. That would be what is visible on the website from MapComplete and also the Viewer
  • Does the preview load the big image or the preview. The API calls above mention a smaller version. And the load time is rather bad for me, so maybe there is a smaller preview?

  • Where does GoMap explain to users what is happening with this feature? For example, that images are public (get anonymized) and shared under a specific license etc.

  • Can you share a quick note on how you implemented this from an Auth point of view – I would like to share it with StreetComplete and Every Door since there are tickets on this topic over there as well.

  • It would be great to have the same feature for OSM Notes. To be able to add an image URL to the note right from the new note or new note comment UI

tordans avatar Mar 27 '25 12:03 tordans

@tordans

When I took the image with GoMap, I had to OAuth somewhere.

Yes, I'm uploading images to panoramax.openstreetmap.fr as you guessed, which authenticates against the OSM server. MapComplete uses a private instance with a single user account that shares all uploads, so authentication isn't required. The advantage of having photos tied to an OSM account is:

  • Users can manage their own photos on the panoramax website. They can delete photos, etc.
  • If a user is uploading inappropriate material its easy to identify and ban them.

The credentials are stored in cookies as part of your regular Safari profile, so if you visit panoramax.openstreetmap.fr in Safari before or after uploading then you're already authenticated, and the credentials will persist for several weeks or until you clear cookies.

That icon is a bug, right? Is it supposed to be two icons or one?

That is Apple's camera icon.

What does the blue logo at the top do? I see a Panoramax Map of europe but don't know what to do with that page. Can I choose an image from there to add an existing image?

You can't do anything interesting on that page, but you can use it to navigate to your personal profile where your image uploads are stored. We should probably change the URL to "https://panoramax.openstreetmap.fr/your-pictures"

Looking at images that where uploaded via MapComplete cannot be viewed AFAIK and I think it happens because you use the fr and not the xyz domain.

When trying to download images I try both the .xyz and the .fr domains, because uploaded images appear first in .fr and later in .xyz. There are various delays so if you upload from MapComplete it may not show up in xyz for a while (up to an hour in my limited experience).

For MapComplete, it would be ideal to optionally show the Exif.Image.Artist as well.

You mean when using MapComplete as a viewer? Since it's already tied to an OSM ID MapComplete should be able to extract that.

Does the preview load the big image or the preview.

I'm downloading the "sd.jpg" version rather than the "hd.jpg" version, so it should be smaller (but it's still large).

Where does GoMap explain to users what is happening with this feature? For example, that images are public (get anonymized) and shared under a specific license etc.

It doesn't! 😅 I guess we could add some text to the initial window for that.

Edit: I added some text to the window: "Panoramax is a public, decentralized hosting service for geolocated street-level pictures. Uploaded photos are published under a share-alike (CC-BY-SA) license. Faces and PII are automatically blurred. Uploaded photos are associated with your OSM identity."

Anything else it should say?

Can you share a quick note on how you implemented this from an Auth point of view

I open a Safari window at https://panoramax.openstreetmap.fr/api/auth/login, and provide client_id and scope info similar to doing an OAuth2 handshake. The panoramax server contacts the OSM server and pops up its own OAuth2 page that the user agrees to, and then finally it sends us a cookie containing an authentication token. That cookie/token is automatically provided to the server when we do additional calls.

It would be great to have the same feature for OSM Notes. To be able to add an image URL to the note right from the new note or new note comment UI

Agreed, but that is more confusing from a user perspective compared to clicking a field named "panoramax"

bryceco avatar Mar 31 '25 01:03 bryceco

Thanks for the update @bryceco. This looks all great. Here are a few pieces that I wanted to clarify:

That icon is a bug, right? Is it supposed to be two icons or one?

That is Apple's camera icon.

To me it looks like two images overlap? An eye and a camera?

Image Image

I assume those are https://developer.apple.com/sf-symbols/ but I did not find a online reference to compare them…

For MapComplete, it would be ideal to optionally show the Exif.Image.Artist as well.

You mean when using MapComplete as a viewer? Since it's already tied to an OSM ID MapComplete should be able to extract that.

No, I meant to show two infos: The owner of the image and the data that is stored in Exif.Image.Artist (if any). This is the hack that MC uses, to upload everything with one user and then use the Author field to show the real name. It looks like the show both data on the official websites as well.

It would be great to have the same feature for OSM Notes. To be able to add an image URL to the note right from the new note or new note comment UI

Agreed, but that is more confusing from a user perspective compared to clicking a field named "panoramax"

Yes, but I don't see why a button "Comment with a picture" followed by a very similar panoramax flow that you have would not work.

tordans avatar Apr 05 '25 12:04 tordans