3

I am migrating from 2.14 and have some features that come with a radius property.

The expected behaviour is that when the users zooms in or out the feature renders without perceptible jumps as with 2.14.

http://gyazo.com/bb46051994981d6d22cec4f7f88ff03a (ol 3) http://gyazo.com/4f6a2793abacc597029c3c28cfec316f (ol 2.14)

Current code (v3)

var layer = new ol.layer.Vector({
    source: new ol.source.Vector(),
    style: styleFunction
});

var styleFunction = function(feature, resolution) {
    return [new ol.style.Style({
        stroke: new ol.style.Stroke({
          color: 'red',
          width: 3
        }),
        fill: new ol.style.Fill({
          color: 'rgba(255, 0, 0, 0.1)'
        }),
        image: new ol.style.Circle({
            radius: calculateRadius(feature, resolution),
            fill: new ol.style.Fill({
              color: 'rgba(255, 0, 0, 0.1)'
            }),
            stroke: new ol.style.Stroke({
                color: 'orange', 
                width: 2
            })
          })
      })];
};

Previous code (v2.14)

var context = {
    getRadius: function(feature) {
        var radius = setup.DEFAULT_RADIUS;
        if (feature.attributes && feature.attributes.radius) {
            radius = feature.attributes.radius;
        }
        return radius / feature.layer.map.getResolution();
    }
};

var defaultStyle = new OpenLayers.Style({
  "pointRadius": "${getRadius}"
}, { context: context });

var layer = new OpenLayers.Layer.Vector("layer", {
    styleMap: defaultStyle
});
1

Got the answer from the ol team.

This is closer to what we had in v2.14 but still shows poorly on zoom out though.

http://gyazo.com/3f93b241421a8dc73d0f77d39e5c3300

Resulting code requires and extra indirection to get styling and features working as well.

var layer = new ol.layer.Image({
    source: new ol.source.ImageVector({ 
        source: new ol.source.Vector(), 
        style: styleFunction 
    })
});

//layer.getSource().getSource().clear();
//layer.getSource().getSource().addFeatures(parsedFeature);

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.