Cesium Property之修改entity屬性不生效
技術標籤:AboutCesium
先貼幾個學習的地址
Cesium原理篇:Property
Cesium的Property機制總結,github
問題
修改entity的width不生效?
解決辦法
原因:其實還沒太弄清楚裡面的機制,因為直接編輯立即生效,移除後重新生成則不生效,可能是第二次生成的地方出了問題,也可能是其他的原因,後面有空了再研究一下,這裡還涉及了一個漸變的動畫,後續再搞。
// 不生效
entity.polyline.width = value;
// 方法1
entity.polyline.width.setValue(value);
// 方法2 解決blink問題
entity. polyline.width = new Cesium.CallbackProperty( function(){return value}, false);
參考資料
貼幾個
CallbackProperty使用
https://github.com/CesiumGS/cesium/issues/5031
https://github.com/CesiumGS/cesium/issues/7782
https://github.com/CesiumGS/cesium/issues/7934
https://stackoverflow.com/questions/36747621/updating-cesium-callback-property-causes-the-entity-to-flash
- A concise explanation of the problem you’re experiencing. I want to change the color of a polygon entity. When I do this there is a flash
where the object turns transparent or invisible, and you see the
underlying globe imagery. I would like the color to change cleanly
without the visual disruption. From what I’ve read in this groupCesium may not be optimized for changing properties like this after an
entity has already been created, and the preferred approach is to use
callback properties (which does indeed work much better with my
example scene). However, I’m concerned having callbacks on many
entities will slow things down, and I would prefer to explicitly
change entities directly.- A minimal code example. If you’ve found a bug, this helps us reproduce and repair it. Toggle between red and blue in the drop down.
On my system I see a few frames where the object turns transparent
before it changes color.
url- Context. Why do you need to do this? We might know a better way to accomplish your goal. I want to be able to cleanly change the color of
1 or many polygons at any time.- The Cesium version you’re using, your operating system and browser. Latest 1.54, Chrome and Firefox Windows 10. Tried both nvidia and
intel gfx modes on my Dell XPS 9560 15".Answer:
This is something that has bothered me in the past as well. This is a “feature not a bug”. Entities in Cesium are created asynchronously, and when certain properties change, the underlying primitives are recreated, so there might be a few frames where nothing renders. This is usually nice because then the application/browser does not freeze when a lot of geometry/materials are being updated, but in cases like this it would be nice to synchronously create the underlying primitives.
When using the lower level primitive API, you can choose whether it should be sync/async. This is not exposed in the Entity API. If you’re interested in making this change to expose anasynchronous
flag in the Entity API I think a contribution would be very welcome! I’d be happy to help out.
If you have a local build of CesiumJS set up, you can see how this would change your demo by hardcoding asynchronous = false in this line so it affects all entities (as long as they’re not draped over the globe/terrain, those use GroundPrimitive.js):
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Scene/Primitive.js#L291
Although even after setting this, there seems to be 2 frames where the entity disappears, where it’s state is set to “READY” before being “COMPLETE”. There might be something else required to tweak. This is where this sync/async load happens:
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Scene/Primitive.js#L1894-L1900
The way Entities and Primitives relate is that when you create an entity, there will typically be a XVisualizer.js class responsible for creating the underlying primitives. So for example, when creating models, the ModelVisualizer is responsible for updating it:
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/DataSources/ModelVisualizer.js#L88
For most geometries, there’s a GeometryVisualizer:
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/DataSources/GeometryVisualizer.js
But the actual creation of the primitive would be in one of these batches, here:
https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/DataSources/StaticGeometryColorBatch.js#L148-L157