function drawThermo(tempMax,tempMin,temperature,placeholderID)
	{
	
	var emptyBar=[];
	var emptyBarEnd=[];
	var currentTempBarEnd=[];
	var currentTempBar=[];
	var scaleAxis=[];
	var maxTickTemp=[];
	var minTickTemp=[];
	
	var yTempMin = -10;
	var yTempMax = 40;
	var tempMajorTickInterval=5;
	var tempMinorTickInterval=1;
	
	
	
	
	
	// Create Empty Bar Data
	emptyBar.push([3,yTempMax,yTempMin]);
	// Create Semi Circles on Ends
	// Fill Bar with current temp
	currentTempBar.push([3,temperature,yTempMin]);
	// Create Scale
	scaleAxis.push([2.4,yTempMin-1],[2.4,yTempMax+1],null);
	for(var i = 0;i<=(yTempMax-yTempMin)/tempMajorTickInterval ;i+=1)
	{
		scaleAxis.push([2.4,yTempMin+i*tempMajorTickInterval],[1.8,yTempMin+i*tempMajorTickInterval],null);
	}
	for(var i = 0;i<=(yTempMax-yTempMin)/tempMinorTickInterval ;i+=1)
	{
		scaleAxis.push([2.4,yTempMin+i*tempMinorTickInterval],[2.1,yTempMin+i*tempMinorTickInterval],null);
	}
	scaleAxis.push([3,-10],[3,40],null,[4,-10],[4,40],null);
	for (var i = Math.PI; i <= 2*Math.PI; i += 0.02)
       scaleAxis.push([3.5+0.5*Math.cos(i), -10+2*Math.sin(i)]);
	   scaleAxis.push(null);
	for (var i = 0; i <= Math.PI; i += 0.02)
        scaleAxis.push([3.5+0.5*Math.cos(i), 40+2*Math.sin(i)]);
	
	
	maxTickTemp.push([2.5,tempMax],[2.9,tempMax]);
	minTickTemp.push([2.5,tempMin],[2.9,tempMin]);
	
	for (var i = Math.PI; i <= 2*Math.PI; i += 0.02)
        currentTempBarEnd.push([3.5+0.5*Math.cos(i), -10+2*Math.sin(i)]);
	
	for (var i = 0; i <= Math.PI; i += 0.02)
        emptyBarEnd.push([3.5+0.5*Math.cos(i), 40+2*Math.sin(i)]);
	
	
	
	
	var plot = $.plot($(placeholderID), [ 
							{data: emptyBar, color:"#000000", shadowSize:0, bars: {show:true,lineWidth:0,fillColor:"#eeeeee"} },
							{data: currentTempBarEnd, color:"#993333",shadowSize:0,lines:{fill:true,lineWidth:0,fillColor:"#bb0000"}},
							{data: emptyBarEnd, color:"#ddd",shadowSize:0,lines:{fill:true,lineWidth:0,fillColor:"#eeeeee"}},
							{data: currentTempBar, color:"#993333", shadowSize:0, bars: {show:true,lineWidth:0,fillColor:"#bb0000"} },
							{data: scaleAxis, color:"#999999", shadowSize:0, lines: {lineWidth:1}} ,
							{data: maxTickTemp, color:"#990000",shadowSize:0},
							{data: minTickTemp, color:"#000099",shadowSize:0}
						   
						  
						 ],
	{
	
	yaxis :{ min: yTempMin-8, max: yTempMax+4},
	xaxis: {min:0, max: 5},
	grid :{show:false}
	});
	
	var o;
	for(var i=yTempMin;i<=yTempMax;i+=2*tempMajorTickInterval)
	{
    o = plot.pointOffset({ x: 1.2, y: i});
    // we just append it to the placeholder which Flot already uses
    // for positioning
    $(placeholderID).append('<div style="position:absolute;text-align:right; right:65% ;top:' + (o.top-6) + 'px;color:#999999;font-size:10px">'+i+'</div>');
	}

       var o;
	o=plot.pointOffset({x:1.3,y:yTempMin-3});
	$(placeholderID).append('<div style="position:absolute;padding:0;margin:auto;text-align:center; left: '+(o.left)+'px;top:'+(o.top)+'px;color:#999999;font-size:13px">'+temperature+'&deg;C</div>');
	
	


	
	
}


    
function drawWind(valueToDisplay,dataMax,circleScaleMinimum,circleScaleMaximum,numCircleMajorTicks,numCircleMinorTicks,ticksOutside,gaugeLabel,placeholder) {	

	
	//var placeholder='#placeholder';
	//var valueToDisplay=1.6;		// Actual data value
	//var dataMax = 3.2;
	//var circleScaleMinimum = 0;		// Minimum value to appear on scale
	//var circleScaleMaximum = 50;	// Maximum value to appear on scale
	//var numCircleMajorTicks = 5;	// Number of major tick marks
	//var numCircleMinorTicks = 25;	// Number of minor tick marks
	//var ticksOutside=1;
	//var gaugeLabel='Wind Speed (mph)';
	
	var circleRatio=9/12;			// Amount of the full circle to be used for scale
	
	var needleLength = 0.90;		// Length of needle, ratio with radius of gauge
	
	
	// Calculate the angle (in Radians) that the scale should be, then calculate where it should start (0 = horizontal right)
	var circleAngle = 2*Math.PI*circleRatio;
	var circleAngleStart = (Math.PI-circleAngle)/2;
		
	// Calculate the angle between each tick on the scale	
	var angleOfMajorTicks = circleAngle/numCircleMajorTicks;
	var angleOfMinorTicks = circleAngle/numCircleMinorTicks;
	
	var centrePointX=7;
	var centrePointY=8;
	var radius=4;
    
	// Holders for plot data series
	var outerCircle = [];
	var needle = [];
	var tickPoints = [];
	var needleHub=[];
	var dataWindMax=[];
	
	
		// data for outer circle
	for (var i = circleAngleStart; i <= circleAngleStart+circleAngle; i += 0.02)
        outerCircle.push([centrePointX+radius*Math.cos(i), centrePointY+radius*Math.sin(i)]);
	
	// Create tick points on circle
	
	
	var tickPointLength = 0.6;
	var minorTickPointLength = 0.3;
	var scaleRadius = 1.3;

	if (ticksOutside==1)
	{
		tickPointLength = tickPointLength*-1;
		minorTickPointLength = minorTickPointLength*-1;
		scaleRadius=scaleRadius*1.05;
	}
	var tickX;
	var tickY;
		
	
	for(var i = 0;i<=numCircleMajorTicks;i+=1)
	{
		circumPointX = centrePointX + radius*Math.cos(circleAngleStart+angleOfMajorTicks*i);
		circumPointY = centrePointY + radius*Math.sin(circleAngleStart+angleOfMajorTicks*i);
		tickX = centrePointX + (radius-tickPointLength)*Math.cos(circleAngleStart+angleOfMajorTicks*i);
		tickY = centrePointY + (radius-tickPointLength)*Math.sin(circleAngleStart+angleOfMajorTicks*i);
	  tickPoints.push([tickX,tickY],[circumPointX,circumPointY],null);
	  }
	  
	  
	  
	  for(var i = 0;i<=numCircleMinorTicks;i+=1)
	  
	{
		circumPointX = centrePointX + radius*Math.cos(circleAngleStart+angleOfMinorTicks*i);
		circumPointY = centrePointY + radius*Math.sin(circleAngleStart+angleOfMinorTicks*i);
		tickX = centrePointX + (radius-minorTickPointLength)*Math.cos(circleAngleStart+angleOfMinorTicks*i);
		tickY = centrePointY + (radius-minorTickPointLength)*Math.sin(circleAngleStart+angleOfMinorTicks*i);
	  tickPoints.push([tickX,tickY],[circumPointX,circumPointY],null);
	  }
	
	// Draw centre 'hub' for needle
	for (var i = 0;i<=2*Math.PI;i+= 0.02)
		needleHub.push([centrePointX+radius*0.1*Math.cos(i),centrePointY+radius*0.1*Math.sin(i)]);
		
	// Draw needle
		
	var needlePointX;
	var needlePointY;
	var needlePointAngle;
	
	
	needlePointAngle= (circleAngleStart+circleAngle)-(circleAngle*((valueToDisplay-circleScaleMinimum)/(circleScaleMaximum-circleScaleMinimum)));
	
	// The point of the needle
	needlePointX = centrePointX + (radius*needleLength)*Math.cos(needlePointAngle);
	needlePointY = centrePointY + (radius*needleLength)*Math.sin(needlePointAngle);
	
	var circumPointXHub1 = centrePointX + radius*0.08*Math.cos(needlePointAngle-0.25*Math.PI);
	var circumPointYHub1 = centrePointY + radius*0.08*Math.sin(needlePointAngle-0.25*Math.PI);
	var circumPointXHub2 = centrePointX + radius*0.08*Math.cos(needlePointAngle+0.25*Math.PI);
	var circumPointYHub2 = centrePointY + radius*0.08*Math.sin(needlePointAngle+0.25*Math.PI);
	needle.push ([circumPointXHub1,circumPointYHub1],[needlePointX,needlePointY],[circumPointXHub2,circumPointYHub2],[circumPointXHub1,circumPointYHub1]);
	
	//**************************************************
	// Draw max
	//**************************************************
	
	
	var maxIntPointX;
	var maxIntPointY;
	var maxPointAngle;
	var maxArrowSize = 0.90;
	
	maxPointAngle= (circleAngleStart+circleAngle)-(circleAngle*((dataMax-circleScaleMinimum)/(circleScaleMaximum-circleScaleMinimum)));
	
	// The point of the max
	var maxPointX = centrePointX + (radius)*Math.cos(maxPointAngle);
	var maxPointY = centrePointY + (radius)*Math.sin(maxPointAngle);
	var maxPointIntX = centrePointX + (radius*0.95)*Math.cos(maxPointAngle);
	var maxPointIntY = centrePointY + (radius*0.95)*Math.sin(maxPointAngle);
	
	// Need to draw arrow/triangle to that point
	var max=[];
	
	var maxPointX1 = centrePointX + radius*maxArrowSize*Math.cos(maxPointAngle-Math.PI/180*Math.PI);
	var maxPointY1 = centrePointY + radius*maxArrowSize*Math.sin(maxPointAngle-Math.PI/180*Math.PI);
	var maxPointX2 = centrePointX + radius*maxArrowSize*Math.cos(maxPointAngle+Math.PI/180*Math.PI);
	var maxPointY2 = centrePointY + radius*maxArrowSize*Math.sin(maxPointAngle+Math.PI/180*Math.PI);
	max.push ([maxPointX1,maxPointY1],[maxPointX,maxPointY],[maxPointX2,maxPointY2],[maxPointIntX,maxPointIntY],[maxPointX1,maxPointY1]);

	
	
	var plot = $.plot($(placeholder), [ 
	{data:needle,shadowSize:0,color:"#999999",lines : {fill:true, fillColor:"#e0ffff",lineWidth:1} },
	{data:needleHub,shadowSize:0,color:"#999999", lines : {fill:true, fillColor:"#99DDDD",lineWidth:1} },
	{data:outerCircle,shadowSize:0,color:"#999999",lines:{lineWidth:1}},
	{data:tickPoints,shadowSize:0,color:"#999999",lines:{lineWidth:1}},
	{data:max,shadowSize:0,color:"#990000",lines:{fill:false,fillColor:"#990000",lineWidth:1}}
	
	],{
	yaxis :{ min: 0, max: 14},
	xaxis: {min:0, max: 14},
	grid :{show:false}
	});
	
	
	var outsideTickX;
	var outsideTickY;
	
	
	for(var i = 0;i<=numCircleMajorTicks;i+=1)
	
	{
	var o;
	outsideTickX = centrePointX + (radius * scaleRadius)*Math.cos(circleAngleStart+angleOfMajorTicks*i);
	outsideTickY = centrePointY + (radius * scaleRadius)*Math.sin(circleAngleStart+angleOfMajorTicks*i);
		
    o = plot.pointOffset({ x: outsideTickX, y: outsideTickY});
    // we just append it to the placeholder which Flot already uses
    // for positioning
    $(placeholder).append('<div style="width:20px;position:absolute;padding:0;margin:0;text-align:center; left: '+(o.left-10)+'px;top:'+(o.top-5)+'px;color:#999999;font-size:10px">'+ (circleScaleMaximum - (i * ((circleScaleMaximum-circleScaleMinimum)/numCircleMajorTicks) ) ) +'</div>');
	}
	
	var o;
	o=plot.pointOffset({x:7,y:3});
	$(placeholder).append('<div style="width:100px;position:absolute;padding:0;margin:auto;text-align:center; left: '+(o.left-50)+'px;top:'+(o.top)+'px;color:#999999;font-size:10px">'+gaugeLabel+'</div>');
	
	
	
	
	
	
	
	
	

}