this is the javascript code (currently commented out). it alsa has the
google jaspi line.
google.load('visualization', '1', {packages:['gauge']});
google.setOnLoadCallback(drawChartMemory);
google.setOnLoadCallback(drawChartCPU);
google.setOnLoadCallback(drawChartTemp);
function drawChartMemory() {
//Memory gauge
var dataMemory = google.visualization.arrayToDataTable([
['Label', 'Value'],
['Memory', <?php echo $percent_used; ?>]
]);
var optionsMemory = {
width: 266, height: 120,
redFrom: 90, redTo: 100,
yellowFrom:75, yellowTo: 90,
minorTicks: 5
};
var chartMemory = new
google.visualization.Gauge(document.getElementById('chart_div_memory'));
chartMemory.draw(dataMemory, optionsMemory);
}
function drawChartCPU() {
var dataCPU = google.visualization.arrayToDataTable([
['Label', 'Value'],
['CPU', <?php echo $cpuload; ?>]
]);
var optionsCPU = {
width: 266, height: 120,
redFrom: 90, redTo: 100,
yellowFrom:80, yellowTo: 90,
minorTicks: 5
};
var chartCPU = new
google.visualization.Gauge(document.getElementById('chart_div_cpu'));
chartCPU.draw(dataCPU, optionsCPU);
}
function drawChartTemp() {
var dataTemp = google.visualization.arrayToDataTable([
['Label', 'Value'],
['Temp', <?php echo $cpu_temperature; ?>]
]);
var optionsTemp = {
width: 133, height: 120,
redFrom: 75, redTo: 80,
yellowFrom:70, yellowTo: 75,
minorTicks: 5,
max: 80
};
var chartTemp = new
google.visualization.Gauge(document.getElementById('chart_div_temp'));
chartTemp.draw(dataTemp, optionsTemp);
}
and here the html code.
<table class="w400">
<tr>
<td class="head center">Gauges</td>
</tr>
<tr>
<td>
<div id='chart_div_memory'></div>
<div id='chart_div_cpu'></div>
<div id='chart_div_temp'></div>
</td>
</tr>
2013/9/6 asgallant <[email protected]>
> Normally, Gauges draw side-by-side, until they have filled the width of
> the container div. Post your code and I'll take a look to see why they
> aren't drawing side-by-side.
>
>
> On Friday, September 6, 2013 4:02:29 PM UTC-4, Maxim Van Damme wrote:
>>
>> I would like to have some gauges in a webpage and i would like the color
>> options to be different but I cant get them layed out correctly
>>
>> this is how i would like the colors:
>>
>> <https://lh4.googleusercontent.com/-hrTK4EdiiGE/Uio0Roy3gpI/AAAAAAAAAI0/IS-wahlT8Us/s1600/wrong.PNG>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>>
>> and this is how i would like the gauges to be layed out:
>>
>> <https://lh4.googleusercontent.com/-SJaVgVK4gv0/Uio0f-4-IsI/AAAAAAAAAI8/M4KWEf-MiXk/s1600/wrong2.PNG>
>>
>>
>>
>>
>>
>>
>>
>>
>> thanks in advance
>>
> --
> You received this message because you are subscribed to a topic in the
> Google Groups "Google Visualization API" group.
> To unsubscribe from this topic, visit
> https://groups.google.com/d/topic/google-visualization-api/ec7_k9IQg9A/unsubscribe
> .
> To unsubscribe from this group and all its topics, send an email to
> [email protected].
> To post to this group, send email to
> [email protected].
> Visit this group at
> http://groups.google.com/group/google-visualization-api.
> For more options, visit https://groups.google.com/groups/opt_out.
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.
