javascriptgoogle-maps-api-3google-indoor-maps

level picker in JavaScript API v3 for indoor maps


I'm doing an offline mapping of my school building. One of the buildings have 9 floors. Just started to test and put two ground Overlays that way:

layer1 = new google.maps.GroundOverlay('images/2floor.svg', layerBounds); layer2 = new google.maps.GroundOverlay('images/1floor.svg', layerBounds);

In other words, I've placed the two layers in the same spot.

I believed that when I increase zoom in the area, the floor picker would be shown, but that doesn't happen.

I appreciate any help with this.


Solution

  • The V3 version of javascript GroundOverlay does not support what you want to do. Google Maps will just lay the second GroundOverlay over the first, and the first will never show.

    With the upcoming demise of Google Maps Engine, and because we had a need to show different imagery at different zoom levels plus non-rectangular satellite imagery, we wrote a GroundOverlayEX javascript class for Google Maps API V3. It does everything the Google Earth version of GroundOverlay does (including image rotation, non-rectangular images, drawing order, support for switching images at different zoom levels, etc).

    The class is up on GitHub at https://github.com/azmikemm/GroundOverlayEX There is complete API documentation there too (documentation.txt). This is a recent coding effort.

    If you want to see a working example of the class in action, you can visit https://sites.google.com/site/issearthatnight/. That Google Map is showing 100s of GroundOverlays drapped over North America and at the default zoom is showing low resolution images from NASA. If you zoom in, all the GroundOverlayEX objects auto-switch to high resolution images from NASA.

    The zoom-switching is completely configurable in the class, and can have as many different per-zoom-level images as you want.