no animation when using chart and datacollection ?

Webix JS
#1

Hello !

Do you think it’s possible to keep animation when a chart is synced with a datacollection ?

https://snippet.webix.com/15yiy61p

#2

I found this hack using onAfterAdd/onAfterDelete

https://snippet.webix.com/9x80kqmw

Is there a cleanest way ?

#3

oups !

When i want to have a very smooth animation (i.e animateDuration = 1000), the CPU of chrome/firefox take +20%

Wondering if i’ll not have to use an external chart librarie

#4

Alternative here : Epoch - Real-time Charts , but same thing, eating 20% CPU !

#5

Hey @franck34, the workaround you’ve provided seems to be the only way around this. The reason why the animation doesn’t get triggered in the first place, is because it gets triggered upon the execution of the add method. Meanwhile sync passes the data straight into the DataStore’s pull object, without calling methods like add/remove/updateItem.

However, I’d still like to suggest a small adjustment, instead of using two separate event, you can listen for a onStoreUpdated event of your collection’s DataStore and look for the needed operations (add, delete in this case): https://snippet.webix.com/viyk0efx.

Unfortunately, I can’t really provide any solution to optimize this workaround further. It seems that either way, this is a rather intense task hence why the CPU usage is so high.

#6

Thank you Dzmitry. I already make the adjustement you suggest, it’s ok.

For the optimization, honnestly, i browsed a few canvas (realtime) libs, it’s always the same result: more it’s smooth, more it eat CPU so it’s not webix side.

I’ll stay with 200/400/600 animationDuration so the CPU is < 10%

Thank you