I have singleTiled layer in OL (using chrome). The layer don't draw completely unless I pan the map slowly to the south (here is example how the layer keep drawing itself each time I pan) :

enter image description here

enter image description here

enter image description here

This is how I create the layer :

var vectors = new OpenLayers.Layer.Vector('vectors', {
    isBaseLayer: false,
    singleTile: true,
    layerName: 'vectors',
    displayInLayerSwitcher: true,
    styleMap: roadsStyleMap

Any idea why it happens in chrome only ? (in FF I don't have this problem)

1 Answer 1


From glancing at your screen shots, it seems like your whole vector layer is getting clipped at the same horizontal line. I saw this once before and my fix was to change my CSS.

OpenLayers uses SVG for rendering vectors on Chrome (I'm 95% sure). So whatever styles apply to the svg element might affect your vector layers. When I had this problem, I added this to my stylesheet:

svg {
    overflow: visible;

Then the problem went away. This seems like a sloppy solution (since it just tells the svg element not to clip at its boundaries), and I never identified why the svg element was sized wrong. But it fixed the problem and I never saw any ill effects.

You might also try using Chrome's developer tools to find your vector layer's svg element and see what size it thinks it is.

  • Interesting! I am currently struggling with point vectors that are just not shown on a mobile device (Android, using Phonegap). Do you think that could be a similar issue? PS: works fine on Android when calling the web app, but not once it has been converted with Phongap Feb 4, 2015 at 19:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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