Google Chart - Treemap does not appear

Asked

Viewed 30 times

1

Hello, I’m trying to plot a treemap with data from a BD (mysql), however, nothing appears. I have tried several alternatives and unsuccessfully. I have been able to plot several graphs, except treemap, I believe the problem is in the creation of php data table.

Follow part of php to fetch the data:

	$table = array();

			//colunas 
			$table['cols'] = array(

				array('label'=>'Rota','type'=>'string'),

				array('label'=>'Rota2','type'=>'string'),

                 array('label'=>'Entregas','type'=>'number'),

					array('label'=>'Entregas_cor','type'=>'number')
				);

			//rows
				$rows = array();
				
					$query = $pdo->prepare("SELECT COUNT(sk_carga) as qtd_entregas, carga_rota as rota FROM dim_lg_carga where id_empresa = :sk_empresa GROUP BY 2");

					$query->bindParam(':sk_empresa',$sk_empresa, PDO::PARAM_INT);
					$query->execute();


							while ($linha=$query->fetch(PDO::FETCH_ASSOC)){
						


								$rota =$linha['rota'];
								
								$rota2 =null;
								
							$qtd_entregas = intval($linha['qtd_entregas']);
								
								
						$qtd_entregas_cor = intval($linha['qtd_entregas']);

								$temp = array();

								$temp[] = array('v'=>$rota);

								$temp[] = array('v'=>$rota2);

								
								$temp[] = array('v'=>$qtd_entregas);

								$temp[] = array('v'=>$qtd_entregas_cor);


								$rows[] = array('c'=>$temp);
					}

						
						$table['rows'] = $rows;


							$jsonTable = json_encode($table);
							
							
							echo $jsonTable;
							

called JS:

            	google.setOnLoadCallback(desenharGraficoEntregasRotas);
			

						function desenharGraficoEntregasRotas(){
							// ajax
							
							var jsonDados10 = $.ajax({
							//url:"Model/Empresa/get_entregas_motorista.php",
							url:'http://localhost/sistema-bi-web/Model/Empresa/get_rotas_entregas.php',
								dataType: "json",
								async: false

							}).responseText;


						var options10 = {
									     minColor: '#f00',
								          midColor: '#ddd',
								          maxColor: '#0d0',
								          headerHeight: 15,
								          fontColor: 'black',
								          showScale: true

						};
					
							//dados do grafico
							var dados10 = new google.visualization.DataTable(jsonDados10);

						
						var grafico10= new google.visualization.TreeMap(document.getElementById('grafico_entregas_rota'));

							// desenha o grafico de acordo com os parametros passados
							grafico10.draw(dados10, options10); 

		}

HTML part:

	<div class="panel-body">
						<div class="canvas-wrapper">
						<div id="grafico_entregas_rota"></div>
						</div>
					</div>

Exemplification Database:
sk_load column route
1.......... Pituba
2.......... Pituba
3.......... Pituba
4.......... Pituba
5.......... Sprouts
6.......... Pituba
7.......... You sprout...
8.......... Green line

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.