I have a zoomable, draggable map (leaflet) showing pin points of addresses across a city. For each of those addresses, I have a photo of the building at that address. The photos are big, high-rez shots -- not google street view.
Is there any conventional wisdom (or data) on how to display the images associated with the pin points. I can think of a few options:
- You click a pin point and a big dialog opens, showing the photo. The advantage to this is that the photo looks great. The disadvantage is that you have to click to see the photo: extra step.
- You hover over the pin point and a small photo window opens around your mouse, almost like a tool tip. I don't usually like these because the photos are too small to tell you much.
- I split the screen showing the map on the left and the photos on the right. Whatever point on the map is closest to the users mouse gets its photo shown on the righthand side. The disadvantage here is that you lose some of the detail in the photo, as opposed to the popup.
- A pane in the corner of the map showing the photo.
Are there are other ways? Is there a conventional wisdom on how to do this?
Mobile-friendly is good and -- but not the primary consideration in the design. I can modify some of the coding for small phones.
A little context: I work for a news organization. The city says it has demolished or fixed blighted properties. The photos show if the properties are really fixed -- or just counted as not blighted.