<?php $__env->startSection("content"); ?>

    


    <!-- #########################################################################################-->
    <!--rgba(220,220,220,0.5), rgba(151,187,205,0.5)-->
    <!-- #########################################################################################-->
			<!-- start chart -->	
		<?php
		$Array='';
		foreach($yyy as $row){
			$Array .= "['".$row->nm."','".$row->budget."','".$row->expt."'],";
		}
		$Array = rtrim($Array,',');
		?>
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
       <div id="dual_x_div" style="width: 900px; height: 500px;"></div>
        <script>
          google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawStuff);

      function drawStuff() {
        var data = new google.visualization.arrayToDataTable([['Galaxy', 'Budget', 'Expense'],<?php echo $Array; ?>]);
		

        var options = {
          width: 800,
          chart: {
            title: 'Budget and Expense graph',
            subtitle: ''
          },
          bars: 'vartical', // Required for Material Bar Charts.
          series: {
            0: { axis: 'distance' }, // Bind series 0 to an axis named 'distance'.
            1: { axis: 'brightness' } // Bind series 1 to an axis named 'brightness'.
          },
          axes: {
            x: {
              distance: {label: 'parsecs'}, // Bottom x-axis.
              brightness: {side: 'top', label: 'apparent magnitude'} // Top x-axis.
            }
          }
        };

      var chart = new google.charts.Bar(document.getElementById('dual_x_div'));
      chart.draw(data, options);
    };
        						
		</script>

	        <!-- end chart-->
	
        <div style="clear:both;height:20px;"></div>
<?php $__env->stopSection(); ?>
<?php echo $__env->make("app", array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>