SVG image as layer is blurry in OpenLayers 4

Question

When i use a svg in an image layer it ends up very blurry, i think it does not scale up from the minimum at all it seems. Here is an example: https://jsfiddle.net/status420/mhfn9anm/2/

var extent = ol.proj.transformExtent([-14, 61, 7, 48], 'EPSG:4326', 
'EPSG:3857');
var projection = new ol.proj.Projection({
    code: 'static-image',
    units: 'pixels',
    extent: extent
});
var map = new ol.Map({
 layers: [
  new ol.layer.Tile({
        source: new ol.source.OSM()
      }),
   new ol.layer.Image({
     source: new ol.source.ImageStatic({
      url: 'https://upload.wikimedia.org/wikipedia/commons/f/fd/Ghostscript_Tiger.svg',
      projection: projection,
      imageExtent: extent
  })
})
],
target: 'map',
view: new ol.View({
center: ol.proj.transform([-1.73, 54.32], 'EPSG:4326', 'EPSG:3857'),
zoom: 5
})
});

SVG File: https://upload.wikimedia.org/wikipedia/commons/f/fd/Ghostscript_Tiger.svg

As you can see the tiger looks awful compared to what it should look like. OpenLayers Icon has a scale variable, but from what i can tell the there is nothing like that for image layers.

Not sure why, i tried it in multiple browsers and it works for me — Michael Kardzhilov, Apr 20 '18 at 13:04
Looks like there is no good solution: There is an [open issue](https://github.com/openlayers/openlayers/issues/4633) and a [solution](https://stackoverflow.com/a/48234214/304179) which does not work well with zooming — dube, Apr 20 '18 at 13:32

SVG image as layer is blurry in OpenLayers 4

0 Answers0