Ola amigos,
Uma dica de como utilizar o Gauge do Google.
Google Charts
Gauge
1 - Adicione o código:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
depois da linha 47 do arquivo page.tag (C:\Program Files\ScadaBR\webapps\ScadaBR\WEB-INF\tags)
2 - Em uma representação gráfica adicione um componente script para o servidor com o seguinte código:
var s = "";
s+=" <script type=\"text/javascript\"> ";
s+=" google.charts.load('current', {'packages':['gauge']}); ";
s+=" google.charts.setOnLoadCallback(drawChart); ";
s+=" function drawChart() { ";
s+=" var data = google.visualization.arrayToDataTable([ ";
s+=" ['Label', 'Value'], ";
s+=" ['RPM', "+value+"] ";
s+=" ]); ";
s+=" var options = { ";
s+=" width: 100, height: 120, ";
s+=" redFrom: 90, redTo: 100, ";
s+=" yellowFrom:75, yellowTo: 90, ";
s+=" minorTicks: 5, max: 1800 ";
s+=" }; ";
s+=" var chart = new google.visualization.Gauge(document.getElementById('chart_div')); ";
s+=" chart.draw(data, options); ";
s+=" } ";
s+=" </script> ";
s+=" <div id=\"chart_div\" style=\"width: 100px; height: 120px;\"></div>";
return s;
Existem algumas opções para ele, verifiquem as opções de configurações.
https://developers.google.com/chart/interactive/docs/gallery/gauge
Resultado:
