I am using the OpenLayers JavaScript API within a web application. I generated a basemap tileset using ArcGIS Server for a particular region and i wrote a code to display the basemap tileset using OpenLayers. But whenever i load the webmap it shows the tiled images as pink and its not displaying... Can someone please help out?enter image description here

Here's the sample code:

<!DOCTYPE html>
<html lang='en'>
<meta charset='utf-8' />
<title>Olabode Olushi OpenLayer</title>
<script type='text/javascript' src='OpenLayers.js'></script>

<script type='text/javascript'>

var map;

function init() {

map = new OpenLayers.Map('map_element', {});

cacheLayer = new OpenLayers.Layer.ArcGISCache( "ArcGISCache",
                    "http://localhost:6080/arcgis/rest/services/Shane/Niagara_Cache_Example/ImageServer", {
                        isBaseLayer: true,



map.addControl(new OpenLayers.Control.LayerSwitcher({}));
map.addControl(new OpenLayers.Control.PanZoomBar({}));




<body onload='init();'>
<div id='map_element' style='margin: 0; width: 1570px; height: 740px; box-shadow: 0px 5px 5px 3px #6B9000'>

1 Answer 1


A possible way of diagnosing these sort of problems is to firstly view the map in Internet Explorer. You can right-click on a tile and copy its url.

Then paste the url into a new window. Hopefully you'll get some sort of error message that will allow you to fix the problem.

You can also use Fiddler to intercept the calls to the map server and read any errror messages.

Your Answer

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

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