<?php include('livedata.php');?>
<div class="updatedtime"><span><?php echo "${cumulus[0]}";?></span><br /><?php echo "${cumulus[1]}";?></div> 
<div class="average">
<?php
echo "${cumulus[18]} <supmb>$pressureunit</supmb>";?>
</div>

         <div id="circularGaugeContainer" style="height:155px;"></div>
         <div class="barometertrend">
 <span style='font-size:0px;'>
 
<?php echo "${cumulus[18]} </span>\n";
if ($cumulus[18]<0) {
   echo "<falling>falling</falling><span style='color:#607d8b;'>
	<i class='wi wi-wind towards-225-deg'></i>
	steadily</span>";
}

elseif ($cumulus[18]>0) {
     echo "<rising>rising</rising><span style='color:#607d8b;'>
	<i class='wi wi-wind towards-45-deg'></i>
	steadily</span>";
}

else echo "<span style='color:#607d8b;'>trend
	<i class='wi wi-wind towards-90-deg'></i></span>
	<steady>steady</steady>";

?></div> 
 <div class="h2mbvalue"><?php echo "${cumulus[10]} <supunit>${pressureunit}</supunit>\n";?>
<script>
$("#circularGaugeContainer").dxCircularGauge({
  rangeContainer: { 
   width: 8,
    offset: -2,
    ranges: [
	  //{ startValue: 960, endValue: 965, color: 'rgba(233, 235, 241, 1)'},
      { startValue: 960, endValue: <?php print "${cumulus[10]}\n";?>, color: 'rgba(242,108,79,0.8)'},
	  { startValue: <?php print "${cumulus[10]}\n";?>, endValue: 1050, color: 'rgba(0,0,0,0.5)'},
	  //{ startValue: 1045, endValue: 1050, color: 'rgba(233, 235, 241, 1)'}
    ]
  },
  
  scale: {
    startValue: 960,  endValue: 1050,
    majorTick: { tickInterval: 10, visible: true, color: 'rgba(255,255,0,0.1)'},
	minorTick: {color: 'rgba(102,161,168,0.1)',visible: true,minorTickInterval: 5,},
	label: {
	format: '',
	font:{size:10},
	
    }
  },
  
  valueIndicator: {
	    type: 'TriangleNeedle',
        color:'#999',
		secondColor:'#f26c4f',
		width:5,
		offset:-10,
		//secondFraction:15		
    },
	
	
	
	
  value: <?php print "${cumulus[10]}"?>,
  subvalues: <?php print "${cumulus[34]}"?>,
    subvalueIndicator: {
        type: 'triangleMarker',
        color: 'rgba(255,255,255,0.5)',		
		space:0,length:14,width:10,offset:2,
    },
	  
});

</script>
