2

I am trying to add non georeferenced image as a Base layer in OpenLayers3 (v.3.8.2). On top of that there is WMS, called from GeoServer, as Overlay. I successfully loaded both layers, but they are not overlapping properly (there is a slight difference between them). Is it possible to do it without georeferencing static image? Also, do I need to state CRS for WMS in GeoServer when I am uploading it.

Here is my code (unfortunatelly, I am not able to give you a valid geoserver link):

 // projection EPSG: 3765
var projection = new ol.proj.Projection({
    code: 'EPSG:3765',
    extent: [250515.0793, 4698849.3024, 747014.5638, 5163391.4419]
});

// extent or bbox of layer in EPGS: 3765
var extent = [260515.0793, 4798849.3024, 757014.5638, 5263391.4419]

// baselayer: map
var imgWidth = 1025;
var imgHeight = 1024;
var url = 'path/to/the/image.png'

var source = new ol.source.ImageStatic({
    url: url,
    imageSize: [imgWidth, imgHeight],
    projection: projection,
    imageExtent: projection.getExtent()
});

var map = new ol.layer.Image({
    source: source
});

// overlay: layer
var layer = new ol.layer.Tile({
        layer:'layer',
    preload: Infinity,
    visible: true,
        source: new ol.source.TileWMS({
            url: 'http://localhost:8080/geoserver/workspace/wms',
            params: {'VERSION': '1.3.0',
                     'LAYERS': 'workspace:layer', 
                     'TILED': true,
                     'bbox': 'extent',
                     //'WIDTH': 256, 
                     //'HEIGHT': 256, 
                     'CRS': 'EPSG:3765', //do I need to state here CRS?
             'FORMAT': 'image/png8'},
           serverType: 'geoserver',
          })
});

// view
var olview = new ol.View({
    projection: projection,
    center: [502024.4795, 4964030.8880],
    extent: extent,
    zoom: 2
})

// map
var map = new ol.Map({
    ol3Logo: false,
    target: 'map',
    renderer: 'canvas',
    view: olview,
    layers: [map, layer],
    controls: ol.control.defaults({}, [
    new ol.control.ScaleLine({
         units: 'metric',
    })
  ]),
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.