<html>
<script type="text/javascript">
google.load("visualization", "1", {packages:['corechart', 'line']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Volume', 'Static Pressure in (WG)', 'Fan power', {'type': 'string', 'role': 'style'}, {type:'string', role:'annotation'}, 'System Curve', {'type': 'string', 'role': 'style'}, {type:'string', role:'annotation'}],
[4783.99, 1197.93, null, null, null, null, null, null],
[4281.76, 2181.03, null, null, null, null, null, null],
[3771.01, 3005.52, null, null, null, null, null, null],
[3285.80, 3617.43, null, null, null, null, null, null],
[2638.86, 4283.32, null, null, null, null, null, null],
[2217.49, 4732.13, null, null, null, null, null, null],
[1759.94, 5078.57, null, null, null, null, null, null],
[1015.11, 5416.02, null, null, null, null, null, null],
[110.54, 5289.88, null, null, null, null, null, null],
[0, 5274.29, null, null, null, null, null, null],
[4783.99, null, 17.49, null, null, null, null, null],
[4281.76, null, 15.67, null, null, null, null, null],
[3771.01, null, 13.93, null, null, null, null, null],
[3285.80, null, 12.29, null, null, null, null, null],
[2638.86, null, 10.36, null, null, null, null, null],
[2217.49, null, 9.24, null, null, null, null, null],
[1759.94, null, 8.15, null, null, null, null, null],
[1015.11, null, 6.02, null, null, null, null, null],
[110.54, null, 3.80, null, null, null, null, null],
[0, null, 3.53, null, null, null, null, null],
[0, null, null , null, null, 0, null, null],
[667.43, null, null , null, null, 622.72, null, null],
[943.89, null, null , null, null, 1245.44, null, null],
[1156.03, null, null , null, null, 1868.16, null, null],
[1334.86, null, null , null, null, 2490.88, null, null],
[1492.42, null, null , null, null, 3113.61, null, null],
[1634.87, null, null , null, null, 3736.33, null, null],
[1765.86, null, null , null, null, 4359.05, null, null],
[2002.30, null, null , null, null, 5604.50, null, null],
[1887.78, null, null ,null, null, 4981.77, 'point { size: 8; shape-type: diamond; fill-color: black; }',null],
[1888, null, 8.46 ,'point { size: 8; shape-type: round; fill-color:grey; }', 'Power', null, null, null],
[2500, null, null ,null, null, 4500.77, 'point { size: 0; shape-type: round; fill-color: grey; }', 'Static Pressure'],
]);
if(0){
var options = {
title: 'Static Pressure and Power',
curveType: 'function',
pointsVisible:'True',
crosshair: { trigger: 'both' },
tooltip: { trigger: 'selection' },
curveType: 'function',
baselineColor: '#ccc',
gridlineColor: '#ccc',
annotations: {
stemColor : 'none'
},
'width':900,
'height':500,
hAxis: {title: 'Volume (CFM)',
viewWindowMode: 'explicit',
gridlines: {
count: 10,
}
},
vAxes: {0: {
title: '\nStatic Pressure (WG)',
viewWindowMode: 'explicit',
gridlines: {
count: 10,
}
},
1: { title: 'Fan Power',
viewWindowMode: 'explicit',
gridlines: {
count: 10,
}
},
},
series:{
0: { targetAxisIndex:0 },
1: { targetAxisIndex:1 },
2: { lineDashStyle: [4, 4]},
},
colors: ["blue", "green", "red"],
};
}
else
{
var options = {
//title: 'Static Pressure and Power',
//crosshair: { trigger: 'both' },
//tooltip: { trigger: 'selection' },
curveType: 'function',
pointsVisible:'True',
baselineColor: '#ccc',
gridlineColor: '#ccc',
annotations: {
stemColor : 'none'
},
//'width':900,
//'height':500,
hAxis: {title: 'Volume (CFM)',
viewWindowMode: 'explicit',
gridlines: {
count: 10,
}
},
vAxes: {0: {
title: 'Static Pressure (WG1)',
gridlines: {
count: 10,
}
},
1: { title: 'Fan Powerusman',
gridlines: {
color: 'transparent',
}
},
},
series:{
0: { targetAxisIndex:0 },
1: { targetAxisIndex:1,lineDashStyle: [4, 4] },
//2: { lineDashStyle: [4, 4]},
},
colors: ["blue", "red", "green"],
//chartArea: { left: "15%", width: "80%", height: "80%", top: "10%", right: "0%"}
chartArea: { left: "11%", width: "80%", height: "70%", top: "10%", right: "0%"}
};
}
var chart = new google.visualization.LineChart(document.getElementById('chart_id'));
chart.draw(data, options);
}
//alert("usman");
//alert(data[1][1]);
</script>
<div id="chart_id" style="width: 700px; height: 300px;"></div>
</html>