Yii2: googleChart Widget extension in Carousel - php

Question

I want show graphs in Carousel, the first graph is shown as well as expected see bellow,
But other slinding graphs are different as seen bellow
Note: All graphs are generated from the same databses tables, bellow is the code from my index.php in frontend/view directory
<?php
use backend\models\WaterLevel;
use backend\models\GaugeSite;
use scotthuangzl\googlechart\GoogleChart;
use kv4nt\owlcarousel\OwlCarouselWidget;
$this->title = 'Water Level';
$model = new WaterLevel();
$siteModel = new GaugeSite();
$siteId = $siteModel->getSiteIds();
$counter = count($siteId);
OwlCarouselWidget::begin([
'container' => 'div',
'containerOptions' => [
'id' => 'container-id',
'class' => 'container-class'
],
'pluginOptions' => [
'autoplay' => true,
'autoplayTimeout' => 3000,
'items' => 1,
'loop' => true,
'itemsDesktop' => [1199, 3],
'itemsDesktopSmall' => [979, 3]
]
]);
/**Loop to generate items */
for($i = 0;$i<$counter;$i++){
$id = $siteId[$i];
$data = $model->getLevels($id);
$readings = [['Hour', 'Water Level']];
foreach($data as $value){
array_push($readings,[$value['submition_time'],(int)$value['reading_level']]);
}
echo GoogleChart::widget(
array('visualization' => 'LineChart',
'data' => $readings,
'options' => array('title' => 'Water Level Reading')));
}
OwlCarouselWidget::end();?>
I also have tried to use the GoogleChart::widget in normal bootstrap4 Carousel, but it behaves the same. I appriciate of your idea to take me out from here.