javascriptgoogle-mapsinfowindowpanoramio

make panoramio pic in google map fill browser


I have a Google map ( http://vispo.com/geogenie/dev/pt3.html ) that displays Panoramio images. I'm trying to make it so that when you click a Panoramio thumbnail, the image fills the browser. As you can see, I am (sort of) almost there. How do I finish it so that it works across browsers of different sizes?

I've looked at the documentation for both the Panoramio API on the Panoramio site ( http://panoramio.com/api/widget/api.html ) and the Google documentation on the Panoramio API ( https://developers.google.com/maps/documentation/javascript/reference#PanoramioLayer ). I've also read the docs on infoWindows.

It seems like maybe one is not meant to display Panoramio images this way? It's easy to just display a small image in a small infoWindow, but it isn't a very interesting thing to do.


Solution

  • I found the answer to the question. The important thing is not to display the image in an infoWindow. Instead, just display a div that covers the map and is not embedded in the map. Have a look at http://vispo.com/geogenie/dev/pt4.html . Click a thumbnail image. It displays large as can be. Then click it to close the image.

    Trying to do it by displaying the image in an infoWindow is very painful because you don't have full control over infoWindow positioning and sizing.