1

I'm writing a directive that controls OpenLayers 3 map. The problem arises when I want to add two layers. For example KML layer and GeoJSON layer. Map then does not work smoothly. You can only zoom but do not move it. Here my code, can you see something you can refactoring?

This is view:

<openlayer geojson-data="['file.geojson']" kml-data="['file.kml']"></openlayer>

and this is piece of code:

map = new ol.Map({
      layers: [
        new ol.layer.Tile({
          source: new ol.source.OSM()
        })
      ],
      target: 'map',
      view: new ol.View({
       center: [0, 0],
       zoom: 2
      })
});

and after initial my map I check if scope exist and do some code, ex.:

if(scope.geojsonData) {
  setMapGeo();
}
if(scope.kmlData) {
  setMapKML();
}

and these are the two methods:

function setMapKML() {
  var KMLLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
      url: scope.kmlData,
      format: new ol.format.KML()
    })
  });
  map.addLayer(KMLLayer);
}

function setMapGeo() {
  var geoJsonLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
      url: scope.geojsonData,
      format: new ol.format.GeoJSON()
    })
  });
  map.addLayer(geoJsonLayer);
}

Maybe in the code I'm doing something wrong? The problem is that it adds two layers to one map?

EDIT I do not think it depends on the size of the data. For example, if I add a layer marker is the situation also takes place.

var vectorMarker = new ol.layer.Vector({
          source: vectorSource,
          style: new ol.style.Style({
            image: new ol.style.Icon(({
              anchor: [0.5, 46],
              anchorXUnits: 'fraction',
              anchorYUnits: 'pixels',
              opacity: 1,
              scale: 0.07,
              src: 'marker.png'
            }))
          })
        });

map.addLayer(vectorMarker);

var point = new ol.geom.Point(ol.proj.transform([33.33, 19.22], 'EPSG:4326', 'EPSG:3857'));
var iconFeature = new ol.Feature({
                  geometry: point
                  });
vectorSource.addFeature(iconFeature);
  • How big and complex are those vector layers? – bugmenot123 Jun 2 '16 at 9:02
  • It looks like you have two accounts - probably better to use just one. – BradHards Jun 2 '16 at 10:20
  • It's up to the size of the data. for me, if the number of features is over 30K, map doesn't move smoothly – Chase Choi May 17 '17 at 3:54

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.