OpenLayers 3: Làm thế nào để Làm mới bản đồ sau khi thay đổi kiểu của Tính năng?


9

Tôi có một bản đồ OpenLayers 3.2.0 có một số nguồn vectơ ( ol.source.Vector) và các lớp vectơ liên quan ( ol.layer.Vector)

Khi các Tính năng ( ol.Feature) được thêm vào các nguồn vectơ, chúng được cung cấp một thuộc datatính được đặt thành đối tượng javascript mà tính năng này thể hiện. TypeScript theo sau ...

vectorSource.addFeature(new ol.Feature({
    geometry: /* ... */,
    data: vectorData,
}));

Các lớp vectơ sau đó có một hàm kiểu để đọc thuộc datatính và lấy kiểu của nó:

vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    renderBuffer: /* ... */,
    style: function (feature: ol.Feature, resolution: any) {
        var data = </* TypeScript Type */>feature.get('data');
        if ((data) && (data.style)) {
            return [data.style];
        }
        else {
            /* return default style */
        }
    }
});

Đôi khi, các sự kiện không liên quan đến bản đồ khiến phong cách thay đổi. Ví dụ, khi một đối tượng trở nên không hợp lệ, kiểu của nó sẽ thay đổi. Rõ ràng, vì data.stylehoàn toàn nằm trong tầm kiểm soát của tôi, việc thay đổi nó là chuyện nhỏ.

Vấn đề là bản đồ không biết rằng phong cách đã thay đổi. Nếu tôi thay đổi kiểu của một đối tượng và sau đó phóng to bản đồ, buộc nó phải vẽ lại, tôi nhận thấy rằng các hàm kiểu của tôi chạy và trả về kiểu mới và tính năng được vẽ lại. Làm thế nào để tôi lập trình buộc bản đồ phải làm mới?

Sau một số tìm kiếm và thử nghiệm, tôi đã thử:

  1. Gọi render()về ol.Mapchính nó.
  2. Gọi dispatchChangeEvent()vàool.source.Vector
  3. Gọi redraw()vàool.layer.Vector

Chúng được đề xuất nhưng không có cái nào hoạt động, điều này không gây ngạc nhiên vì chỉ có phương pháp đầu tiên thậm chí được liệt kê trong tài liệu API OpenLayers 3.2.0 và nó không được đánh dấu là ổn định.


bạn đã thử vectorlayer.refresh ({force: true}); ?
ylka 17/2/2015

Tôi có nhưng, không ngạc nhiên, điều đó không hiệu quả vì đó là phương pháp OpenLayers 2.
Xharlie 17/2/2015

Câu trả lời:


12

Tình cờ, tôi đã vấp phải câu trả lời - đó là tự mình gọi changed()các tính năng sau khi thay đổi thuộc styletính của dữ liệu liên quan của họ. Xem: http://openlayers.org/en/v3.2.0/apidoc/ol.Feature.html?unurdy=true#changed

Điều này đòi hỏi tôi phải theo dõi các ol.Featuređối tượng được liên kết với từng vectorDatađối tượng (trước đây, tôi chỉ cần tìm vectorDatatừ một tính năng, có thể được thực hiện get()) nhưng điều này không tốn nhiều chi phí.

(Tôi thấy điều này bằng cách nhìn vào setGeometrysetStylevà các phương pháp khác trên ol.Featuređể xem những gì họ làm.)


Mặc dù cách tiếp cận này có hiệu quả, việc kêu gọi changedbất kỳ số lượng tính năng hợp lý nào thực sự phải chịu một hình phạt hiệu suất khá nghiêm trọng (đã làm sập Chrome một số lần theo cách này). Tôi khuyên bạn nên gọi changed()vào nguồn của lớp sau khi tất cả các tính năng của bạn đã được thay đổi.
Kyle

0

Tôi đã dành một tuần để cố gắng tìm ra cách làm cho một tính năng (Đa giác) biến mất khỏi bản đồ sau khi xóa nó ( vectorSource.removeFeature(selectedFeature). Và không có giải pháp nào hoạt động. giải pháp hiệu quả với tôi là thay đổi selectedFeaturephong cách:

        var newStyle = new ol.style.Style({
            image: new ol.style.Circle({
                radius: 5,
                fill: new ol.style.Fill({color: 'red'}),
                stroke: new ol.style.Stroke({color: 'yellow', width: 1})
            })
        });
        selectedFeature.setStyle(newStyle)

Bất kỳ kiểu nào cũng sẽ hoạt động vì tính năng này đã bị xóa khỏi lớp nhưng không được làm mới.

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.