Image layer

The image layer contains images of objects placed on the map.

Like any other layer, the image layer is made up of tiles. Before creating this layer, it is sufficient to generate just the tiles that the object images are on. The images must be drawn on a transparent background.

The tiles must be generated for all the zoom levels.

Use the Layer class to create the image layer. This class takes the following parameters:

  • A string template for forming the tile URL, or a function that generates the appropriate URL (for more details, see the Reference).
  • Options for the layer.
var imgLayer = new ymaps.Layer('http://server.domain/images/%z/%x/%y.png', {
        tileTransparent: true // the layer is transparent
    });

The reference to the layer is located in the layers field for the map object. To add the layer to the map, use the add() method:

myMap.layers.add(imgLayer);

The image layer may be placed in the map layers storage. To do this, call the add() method for layer.storage with these parameters:

  • The string key that will be used for accessing the layer being added.
  • The constructor function that creates an instance of the corresponding layer.
var MyLayer = function() {
        return new ymaps.Layer('http://server.domain/images/%z/%x/%y.png', {
                tileTransparent: true 
            })
    }

// Adding a layer to the storage with the key 'my#layer'
ymaps.layer.storage.add('my#layer', MyLayer);