API do Google (gráficos) com lista em jstl

1 resposta
P

Pessoal,

Tenho que montar alguns gráficos e pensei em usar a API do google... só que estou com um problema, meus dados são dinâmicos, dados vindos do banco....

Eu montei no Servlet assim (coloquei em listas porque o resultado varia de acordo com a seleção de checkbox na tela inicial):
+ Lista de títulos
+ Lista de Resultados
+ Adiciono as duas listas em um Object[ListaTitulos, ListaResultados]

Mando o objeto com as duas listas para a JSP assim:

request.setAttribute("medicoes", medicoes[0]); // Lista de titulos
request.setAttribute("resultados", medicoes[1]); // Lista de resultados

Na JSP, tem a api do google como mostro abaixo:

google.load("visualization", "0", {packages:["corechart"]});
google.setOnLoadCallback(drawVisualization);

function drawVisualization() {


// Some raw data (not necessarily accurate)
  var data = google.visualization.arrayToDataTable([
    ['Month', 'Bolivia', 'Ecuador', 'Madagascar'],
    ['Set/05',  165,	200,	40],
    ['Set/09',  135,	40,	80],
    ['Set/11',  157,	350,	32],
    ['Set/15',  139,	70,	22],
    ['Set/20',  136,	400,	90]
  ]);

  var options = {
    title : 'DISPOSITIVO-01',
    vAxis: {title: "Medição"},
    hAxis: {title: "Período"},
    seriesType: "bars",
    series: {3: {type: "line"}}
  };

  var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}

Tentei algo como:

var linhasDoGrafico = "<c:out value='${fn:length(medicoes)}'/>";

var data = google.visualization.arrayToDataTable([[
	<c:forEach var="medicoes" varStatus="posicao" items="${medicoes}">
		<c:out value='${medicoes}'/>,
	</c:forEach>
	],
	[
	<c:forEach var="resultado" items="${resultados}">
		<c:forEach var="valores" items="${resultado}">
			<c:out value='${valores}'/>,	 
		</c:forEach>
	</c:forEach>
	]
]);

Alguém teria alguma sugestão de como montar?

1 Resposta

P

tentei algo como :

<c:forEach var="medicao" varStatus="posicaoTitulos" items="${medicoes}">
<c:choose>
	<c:when test="${posicaoTitulos.last}">
		titulos.push('${medicao}');
	</c:when>
	<c:otherwise>
		titulos.push('${medicao}');
	</c:otherwise>
</c:choose>     
</c:forEach> 

<c:forEach var="resultado" varStatus="posicaoValores" items="${resultados}">
<c:choose>
	<c:when test="${posicaoValores.last}">
		resultados.push('${resultado}');
	</c:when>
	<c:otherwise>
		resultados.push('${resultado}');
	</c:otherwise>
</c:choose>     
</c:forEach> 

var data = google.visualization.arrayToDataTable([
                                                  [titulos],
                                                  [resultados]
                                                ]);

Mas não vai... e nem aponta erro vendo no inspecionar elemento do chrome

Criado 10 de outubro de 2014
Ultima resposta 30 de out. de 2014
Respostas 1
Participantes 1