Đường đứt nét trong OL3?


13

Tôi biết Line dash không hoạt động OL3 (Openlayers 3) đã được hỏi trước đó nhưng giải pháp được đề xuất không hoạt động.

Mã của tôi là:

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],
    linedash: [40,40],
    width: 3
  })
});

Tôi đã thử cả hai [4,4][40,40]đề nghị trong câu hỏi liên kết. Nhưng nó không hoạt động.


2
vui lòng thử lineDash: [4,4]hoặclineDash: [40,40]
Gabor Farkas

@GaborFarkas: Xin chào. Tôi đã thử cả hai nhưng nó không hoạt động
Ishan

Câu trả lời:


19

Đường đứt nét có thể được thực hiện với:

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
})

Tôi đã làm cho bạn một ví dụ trực tuyến!

http://plnkr.co/edit/AW1YNC?p=preview

Bạn có thể sử dụng "trình kiểm tra" trực tuyến này để nhận được các kết hợp khác nhau:

http://phrogz.net/tmp/canvas_dashing_line.html


Ví dụ trực tiếp tốt nhưng bạn có thể mô tả trong câu trả lời của bạn những gì bạn đã làm để có được các đường đứt nét?
Mapperz

1
Cảm ơn tất cả các câu trả lời của bạn. Tôi đã nhận sai lầm. Tôi đã làm điều tương tự mà mọi người bảo tôi làm. Lỗi là một sự khác biệt nhỏ của ký tự chữ thường và chữ hoa. 'Linedash' và 'LineDash'
Ishan
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.