<div id="tab1" class="tab-pane active">
<?php
$data = array(array('2008-05-06', 20), array('2008-05-07', 36), array('2008-05-08', 33), array('2008-05-12', 23));
echo DygraphsWidget::widget(['data' => $data, 'xIsDate' => true, 'jsVarName' => 'bar1', 'options' => ['labels' => array(null, 'Rainfall(mm)')]]);
?>
</div>
<div id="tab2" class="tab-pane">
<?php
$data = array(array('2008-05-06', 20), array('2008-05-07', 36), array('2008-05-08', 30), array('2008-05-12', 23));
echo DygraphsWidget::widget(['data' => $data, 'xIsDate' => true, 'jsVarName' => 'bar2', 'options' => ['width' => '800', 'labels' => array(null, 'Rainfall(mm)')]]);
?>
</div>
<div id="tab3" class="tab-pane">
<?php
$data = array(array('2008-05-06', 20), array('2008-05-07', 30), array('2008-05-08', 33), array('2008-05-12', 23));
echo DygraphsWidget::widget(['data' => $data, 'xIsDate' => true, 'jsVarName' => 'bar3', 'options' => ['width' => '800', 'labels' => array(null, 'Rainfall(mm)')]]);
?>
</div>
</div>
<ul class="nav nav-tabs">
<li class="active"><a href="#tab1" data-toggle="tab">GRAPH</a></li>
<li><a href="#tab2" data-toggle="tab">BAR CHART</a></li>
<li><a href="#tab3" data-toggle="tab">TABLE</a></li>
</ul>
</div>
</div>
</div>
<div class="row main-title">
How is this data collected?
</div>
public function testHtmlOptions()
{
$output = DygraphsWidget::widget(['htmlOptions' => ['id' => 'test-id', 'class' => 'test-class centered', 'data-toggle' => 'dropdown', 'onChange' => "alert('hello')"]]);
$this->assertEquals('<div id="test-id" class="test-class centered" data-toggle="dropdown" onChange="alert('hello')"></div>', $output);
}
