I am creating a map in OpenLayers using Base layer as ESRI online map server. And second layer as our own Esri map server serving the overlay. The base layer shows correctly, but OpenLayers requests some extra tiles at lower zoom levels which do not exist. Check this image too see what I mean:

enter image description here

Now if I zoom in everything looks fine and the data in the overlay is correct. But how do I make OpenLayers not request those pink tiles?

Here is the related code:

For Base Map:

// layerURL loaded using OpenLayers.Protocol.Script()
var baseLayer = new OpenLayers.Layer.ArcGISCache("Street Map", layerURL, {
    layerInfo : layerInfo,
    type : 'png'

    map = new OpenLayers.Map('map', {
    maxExtent : baseLayer.maxExtent,
    units : baseLayer.units,
    resolutions : baseLayer.resolutions,
    numZoomLevels : baseLayer.numZoomLevels,
    tileSize : baseLayer.tileSize,
    displayProjection : baseLayer.displayProjection

    //The layer with the bad tile problem
    layer = new OpenLayers.Layer.XYZ("ESRI", "http://url_removed/tile/${z}/${y}/${x}", {
    format : "image/jpg",
    transparent : "true",
    isBaseLayer : false,
    opacity : 0.8

1 Answer 1


use this:

OpenLayers.Util.onImageLoadError = function() {this.src = '/img/noimg.png';};

i hope it helps you...

  • Thanks buddy! Yep that worked! I still wonder why the wrong tiles are getting generated and if there is a way to fix that.
    – Shaunak
    Jun 18, 2012 at 15:28
  • try to change format : "image/jpg" to png...
    – urcm
    Jun 18, 2012 at 15:33
  • tried. It still requests those tiles.
    – Shaunak
    Jun 18, 2012 at 16:28
  • Try to use arcgisrest for openlayers and define your extents in arcgis server on your service.
    – urcm
    Jun 18, 2012 at 17:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.