2

I am receiving data points in lat/lon. I need to plot all of these on a static image in OpenLayers 3. I am not using OSM or anything else, my image should be the base layer. I got it working by adding the static image layer, setting the extent to be the four corners in lat/lon and then plotting my features on top of it. However this runs in the browser very slowly, and on mobile it will crash the browser after a couple seconds. What is the proper way to do this? Should I be using an overlay instead? Do I need to convert my lat/lon coordinates to pixels?

    var ovProj = ol.proj.get('EPSG:4326');
var myStaticImageLayer = new ol.layer.Image({
    source: new ol.source.ImageStatic({
        url: '../_images/mallSitePlan.png',
        imageExtent: [-121.90320739419553, 37.409945396290674, -121.89234011506653, 37.41962634032544],
        projection: ovProj
    })
});

var view = new ol.View({
    center: ol.proj.transform([-121.90320739419553, 37.409945396290674], 'EPSG:4326', 'EPSG:3857'),
    zoom: 18,
    enableRotation: false
});

var map = new ol.Map({
    target: 'map',
    layers: [myStaticImageLayer],
    view: view
})
  • How big is your static image? – user30184 Feb 7 '17 at 21:12
  • It is pretty small. It essentially is a png of a parking lot. I think it has something to do with me using EPSG:4326 projection instead of pixels? – Truextacy Feb 7 '17 at 21:52
  • How does it compare with this example openlayers.org/en/latest/examples/static-image.html? – user30184 Feb 7 '17 at 21:54
  • I will post the code in my question. It is using a different projection. I tried taking out all of my features and only have the static image layer shown and it still crashed. But If I switch it to pixels, (like the example) it works fine. However then if I plot my points they're in the wrong location. – Truextacy Feb 7 '17 at 21:56

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.