Possible to use OpenLayers in JS API (not other way around)

[JeffPace]

I know there are lots of examples of how to use ESRI resources in OpenLayers, i want to do the opposite.  Is there anyway to get a OpenLayer to display in a ESRI JS API application?

a sample would be really really useful.  Thank you.

[NianweiLiu · Accepted solution]

Attached sample should be what you are looking for. However to make it generically usable you need consider basemap coordinate system, cache scheme switch and other WMS specific issues. Basically

getTileUrl: function(level, row, col) {                   var url = '';                   var lv = this.tileInfo.lodsByLevel[level];                   if (lv) {                     var xmin = (col) * this.tileInfo.width * lv.resolution + this.tileInfo.origin.x;                     var ymin = this.tileInfo.origin.y - (row + 1) * this.tileInfo.height * lv.resolution;                     var xmax = (col + 1) * this.tileInfo.width * lv.resolution + this.tileInfo.origin.x;                     var ymax = this.tileInfo.origin.y - (row) * this.tileInfo.height * lv.resolution;                     url = this.url +                     '?SERVICE=WMS&REQUEST=GetMap&TRANSPARENT=true&FORMAT=image/png&VERSION=1.3.0' +                     '&LAYERS=' + this.layers + '&BBOX=' + xmin + "," + ymin + "," + xmax + "," + ymax +                     '&CRS=EPSG:' + this.tileInfo.spatialReference.wkid +                     '&WIDTH=' + this.tileInfo.width + '&HEIGHT=' + this.tileInfo.height +'&STYLES=';                   }                   return url;                 }

Full code in attachment.

[JeffPace]

Attached sample should be what you are looking for. However to make it generically usable you need consider basemap coordinate system, cache scheme switch and other WMS specific issues. Basically

getTileUrl: function(level, row, col) {
                  var url = '';
                  var lv = this.tileInfo.lodsByLevel[level];
                  if (lv) {
                    var xmin = (col) * this.tileInfo.width * lv.resolution + this.tileInfo.origin.x;
                    var ymin = this.tileInfo.origin.y - (row + 1) * this.tileInfo.height * lv.resolution;
                    var xmax = (col + 1) * this.tileInfo.width * lv.resolution + this.tileInfo.origin.x;
                    var ymax = this.tileInfo.origin.y - (row) * this.tileInfo.height * lv.resolution;
                    url = this.url +
                    '?SERVICE=WMS&REQUEST=GetMap&TRANSPARENT=true&FORMAT=image/png&VERSION=1.3.0' +
                    '&LAYERS=' + this.layers + '&BBOX=' + xmin + "," + ymin + "," + xmax + "," + ymax +
                    '&CRS=EPSG:' + this.tileInfo.spatialReference.wkid +
                    '&WIDTH=' + this.tileInfo.width + '&HEIGHT=' + this.tileInfo.height +'&STYLES=';
                  }
                  return url;
                }

Full code in attachment.

nliu to the rescue! thank you.

[JeffPace]

This worked perfect!!! had to change "CRS" to "SRS" depending on the wms version, but it really speed up performance.  Thank you.