Is it possible to put two different charts(line and bar) in the same container where each of them uses the same data source and share the same legend which is placed at the mid bottom between two charts.

I am trying to work on some real time area chart animation modifying the real time line chart example: , however only the last series gets this shifting animation. Wonder if there is a way to enable all series to have the shifting animation.
Code:
https://jsfiddle.net/y17ae2sx/3/