16

I know Line dash not working OL3 (Openlayers 3) has been asked earlier but the solution proposed is not working.

My code is :

var calculateStyle = new ol.style.Style({
    fill: new ol.style.Fill({
                    color: [255, 255, 255, 0.6],
                    opacity: 0.3
                }),
    stroke: new ol.style.Stroke({
                    color: [0, 153, 255, 1],
                    inedash: [40,40],
                    width: 3
                })
});

I tried both [4,4] and [40,40] suggested in the question linked. But it's not working.

Improve this question
2
  • 3
    please try lineDash: [4,4] or lineDash: [40,40]
    – Gabor Farkas
    Commented May 26, 2015 at 11:59
  • @GaborFarkas : Hi. I already tried both but it's not working
    – Ishan
    Commented May 26, 2015 at 12:34

1 Answer 1

Reset to default
22

Dashed lines can be done with:

new ol.style.Style({
    stroke: new ol.style.Stroke({
        width: 3,
        color: 'rgba(255, 255, 255, 1)',
        lineDash: [.1, 5] //or other combinations
    }),
    zIndex: 2
})

I've made you an online example: http://plnkr.co/edit/AW1YNC?p=preview

You can use this online "tester" to get various combinations http://phrogz.net/tmp/canvas_dashed_line.html

Improve this answer
2
  • 1
    Good Live Example but can you describe in your answer what you did to get the dashed lines?
    – Mapperz ♦
    Commented May 26, 2015 at 14:09
  • 2
    Thanks for all your answers. I got the mistake. I've been doing the same thing everyone's telling me to do. The mistake was a small difference of lower case and upper case characters. 'Linedash' and 'LineDash'
    – Ishan
    Commented May 27, 2015 at 6:45

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.