Setara dengan layer.redraw (true) di OpenLayers 3?

13

Saya memiliki lapisan geojson di aplikasi OL3 yang ingin saya gambar ulang setiap 5 detik (untuk menunjukkan pergerakan di peta).

Bagaimana saya melakukannya ? Tidak dapat menemukan yang setara dengan Layer.redraw ().

openlayers Alophind
sumber
Apakah Anda sudah melihat animasi? Secara umum, gambar vektor lebih halus dan ditangani secara berbeda di ol3, tetapi tidak sepenuhnya jelas dari pertanyaan Anda apa yang ingin Anda lakukan.
John Powell
@ JohnBarça - Data GeoJson saya berasal dari postgres yang diperbarui setiap 5 detik dengan data GPS baru. Saya ingin menggambar ulang layer untuk menunjukkan setiap kali posisi unit saat ini di peta (itu terus berubah ...)
Alophind
Jadi, Anda meminta data setiap 5 detik menggunakan panggilan setTimeout rekursif (atau yang serupa) dan Anda hanya ingin tahu cara memaksa fitur vektor untuk menyegarkan?
John Powell
@ JohnBarça - Jika ada cara yang lebih baik yang saya ingin pelajari, tetapi inilah yang saya lakukan, saya ingin menunjukkan lokasi GPS secara real time di peta. GPS mengirim lokasi mereka ke PostGIS dan dari sana saya membaca data menggunakan GeoJSON (atau saya bisa menggunakan GeoServer) tetapi saya berharap agar layer memperbarui sendiri sesekali.
Alophind
Tentu, saya mendapatkan apa yang Anda coba lakukan. Setiap peluang sampel kode, karena dalam pengalaman saya, jika Anda meletakkan loop animasi di settimeout, dengan panggilan ajax ke server jarak jauh, dan memuat json yang kembali menggunakan Format.GeoJSON atau yang serupa, fitur akan diperbarui.
John Powell

Jawaban:

9

Ini adalah cara Anda dapat menyegarkan sumber vektor setiap 5 detik, dari layanan web yang mengembalikan fitur dalam dokumen GeoJSON:

var vectorSource = new ol.source.Vector();
var geojsonFormat = new ol.format.GeoJSON();

window.setTimeout(function() {
  $.ajax('http://example.com/data.json', function(data) {
    var features = geojsonFormat.readFeatures(data
        {featureProjection:"EPSG:3857"});
    geojsonSource.clear();
    geojsonSource.addFeatures(features);
  });
}, 5000);

jQuery digunakan di sini untuk meminta data melalui Ajax ( $.ajax), tetapi Anda jelas dapat menggunakan perpustakaan pilihan Anda.

Cuplikan kode ini juga mengasumsikan bahwa proyeksi peta adalah "EPSG: 3857" (web mercator) dan bahwa koordinat dalam dokumen GeoJSON adalah bujur dan lintang.

erilem
sumber
3
Kode ini membingungkan saya, haruskah vectorSourcedan geojsonSourcedigabung?
Kelly Thomas
Saya pikir maksud Anda window.setInterval tidak setTimeout; kalau tidak, hanya sekali saja.
Jonathan
9

Saya tahu bahwa pertanyaan ini sudah lama tetapi saya akhirnya menemukan solusi untuk menyegarkan lapisan pada openlayers 3.

Anda harus memperbarui params dari sumber layer seperti ini:

var source = yourLayer.getSource();
var params = source.getParams();
params.t = new Date().getMilliseconds();
source.updateParams(params);
VincentDEJ
sumber
3
Tampaknya tidak semua sumber mendukung updateParamsmetode ini; OL3.18.2 hanya menunjukkan untuk ImageArcGISRest, ImageMapGuide, ImageWMS, TileArcGISRestdan TileWMS, dan bukan untuk, misalnya, ol.source.Vector.
Arjan
Tanggal # getTime mungkin lebih baik daripada Tanggal # getMilliseconds untuk membatalkan cache dan memaksa layer untuk menggambar ulang karena akan memastikan nomor unik setiap kali.
walkermatt
5

Anda dapat menyegarkan layer WFS dengan myLayer.getSource().clear().

dbaston
sumber
1
Ini melakukannya untuk saya dengan OpenLayers 3 v. 0.14.2 dan sumber vektor WFS GeoJSON.
Dirk
3
tidak ada yang salah dengan jawaban satu baris jika mereka mencari uang. harus ada penghargaan reputasi untuk menghapus kotak info ini.
Dennis Bauszus
1
Jawabannya benar, tetapi ini mungkin menunjukkan beberapa kedipan: saat memanggil clear()fitur yang ada akan segera dihapus dari peta, dan hanya ditambahkan lagi setelah menerima respons HTTP. Ini berlaku untuk menentukan nilai untuk VectorOptions#urldan untuk VectorOptions#loader. Untuk data realtime, secara manual melakukan beberapa WebSockets atau XHR magic dan kemudian panggilan getSource().clear()diikuti oleh getSource().addFeatures(...)mungkin terlihat lebih baik bagi pengguna akhir.
Arjan
3

Dengan OL2 saya menggunakan strategi refresh layer yang belum ditambahkan ke OL3. Di bawah ini adalah fungsi panggilan mandiri yang akan menggunakan permintaan ajax untuk mengambil GeoJSON dan kemudian membacanya dan menambahkannya ke sumber.

var yourSource = new ol.source.GeoJSON();

//add this source to a layer, the layer to a map with a view etc
...

//now fetch the data
var fetchData = function () {
    jQuery.ajax(url,
    {
        dataType: 'json',
        success: function (data, textStatus, jqXHR) {
            yourSource.clear(); //remove existing features
            yourSource.addFeatures(yourSource.readFeatures(data));
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(errorThrown);
        }
    });

    //call this again in 5 seconds time
    updateTimer = setTimeout(function () {
        fetchData();
    }, 5000);
};
fetchData(); //must actually call the function!

Semoga ini membantu.

Jon Lynch
sumber
2

Ini berfungsi sempurna untuk lapisan:

layer.changed();

sesuai http://openlayers.org/en/latest/apidoc/ol.layer.Vector.html# berubah

Tomas PR
sumber
1
Anda perlu menjelaskan sedikit lebih banyak tentang bagaimana cara layer.changed();bekerja sempurna untuk layer. Deskripsi dokumentasi Increases the revision counter and dispatches a 'change' event.tidak terlalu membantu. Bagaimana cara menggunakan metode yang diubah () menjawab pertanyaan tentang menggambar kembali peta setiap 5 detik?
nmtoken
Saya telah menggunakan Ajax untuk menyimpan sumber geojson yang direvisi, dan masalah yang saya miliki adalah bahwa jika saya menutup layer dan membukanya kembali peta menggunakan versi sumber yang di-cache (tidak direvisi). Setelah saya membersihkan cache, layer menggunakan sumber yang direvisi seperti yang saya harapkan. Sayangnya, yang disarankan layer.changed();tidak berpengaruh bagi saya, tetapi source.changed();melakukan trik.
Peter Cooper
1

Tidak perlu menyegarkan secara eksplisit. Setiap kali Anda memperbarui konten layer, peta di-refresh meminta rendering bingkai baru.

Untuk memaksa rendering secara manual, Anda memiliki map.render()dan map.renderSync()metode.

EricSonaron
sumber
Itu tidak memperbarui konten, hanya memperbarui kanvas peta itu sendiri.
Mapper