zouyaoji / vue-cesium

🎉 Vue 3.x components for CesiumJS.
https://zouyaoji.top/vue-cesium
MIT License
1.53k stars 325 forks source link

How to update the data for BillboardCollection at regular intervals without flickering effect? #53

Closed philiptran closed 4 years ago

philiptran commented 4 years ago

Hi @zouyaoji,

First of all, thank you for the great library. I'm trying out the component for BillboardCollection by making changes to the vc-collection-primitive-billboard.md. The billboard collection works great for static collection of billboards.

I have a requirement to update the collection of billboards (adding, removing the items or replace the whole collection) at an interval of every X seconds. I try to test this behavior using the attached version of vc-collection-primitive-billboard.md as follow.

1) Create a testUpdate() method that is called every 5 seconds to update the changingBillboards data 2) Cesium viewer updates the changingBillboards correctly with some flickering effect

Expected Result:

  1. What is the correct way to update the changingBillboards data so that Cesium viewer only updates the delta changes in the map and reduces the flickering effect? Assume that I can establish the unique ID for each item in the changingBillboards data.

I have attached my version of vc-collection-primitive-billboard.md for your quick reference.

Thank you.

vc-collection-primitive-billboard.md.TXT

zouyaoji commented 4 years ago

hi @philiptran,非常感谢您的反馈,但是由于您没有使用 创建 issue 页面提交, 将直接被关闭, 谢谢!

zouyaoji commented 4 years ago

Not currently, because changing the billboards array vc-collection-primitive-billboard will overload and cause flicker.

If the billboard's id hasn't changed, I can dynamically change its position in the component by listening for billboards changes。

There is a thought, when a new array is received, the id is compared with the old array. If the id exists in the old array, the information such as the position is updated. If the id does not exist in the old array, it is increased. If the id in the old array is not in the new array id, it is removed. I don't know if it will affect performance.