<!DOCTYPE html>
<html>
<head>
	<script src="https://www.gstatic.com/charts/loader.js"></script>
	<script>
	  google.charts.load('current', {packages: ['corechart']});
	  google.charts.setOnLoadCallback(drawChart);
	  
	  function drawChart() {
	    // Código para dibujar el gráfico
	      var data = new google.visualization.DataTable();
	      data.addColumn('string', 'Element');
	      data.addColumn('number', 'Percentage');
	      data.addRows([
	        ['Nitrogen', 0.78],
	        ['Oxygen', 0.21],
	        ['Other', 0.01]
	      ]);

	      // Instantiate and draw the chart.
	      var chart = new google.visualization.PieChart(document.getElementById('myPieChart'));
	      chart.draw(data, null);
	  }
	</script>
	<title>
		

	</title>
</head>
<body>

		<?php
			// Conectar a la base de datos MySQL
			$conn = mysqli_connect("localhost", "usuario", "contraseña", "basededatos");

			// Obtener los datos que deseas graficar
			$result = mysqli_query($conn, "SELECT user_name, tweets_totales, tweets_positivos, tweets_negativos, tweets_neutrales FROM sentimiento");

			// Crear una tabla de datos de Google Charts y agregar los datos obtenidos
			$table = array();
			$table['cols'] = array(
			    array('label' => 'User Name', 'type' => 'string'),
			    array('label' => 'Tweets Totales', 'type' => 'number'),
			    array('label' => 'Tweets Positivos', 'type' => 'number'),
			    array('label' => 'Tweets Negativos', 'type' => 'number'),
			    array('label' => 'Tweets Neutrales', 'type' => 'number')
			);
			$rows = array();
			while($row = mysqli_fetch_array($result)){
			    $temp = array();
			    $temp[] = array('v' => (string) $row['user_name']);
			    $temp[] = array('v' => (int) $row['tweets_totales']);
			    $temp[] = array('v' => (int) $row['tweets_positivos']);
			    $temp[] = array('v' => (int) $row['tweets_negativos']);
			    $temp[] = array('v' => (int) $row['tweets_neutrales']);
			    $rows[] = array('c' => $temp);
			}
			$table['rows'] = $rows;

			// Configurar las opciones del gráfico
			$options = array(
			    'title' => 'My Chart Title',
			    'width' => 400,
			    'height' => 300,
			    'colors' => array('#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6')
			);

			// Dibujar el gráfico
			echo '<div id="chart_div"></div>';
			echo '<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>';
			echo '<script type="text/javascript">';
			echo "google.charts.load('current', {'packages':['corechart']});";
			echo "google.charts.setOnLoadCallback(drawChart);";
			echo "function drawChart() {";
			echo "var data = new google.visualization.DataTable(".json_encode($table).");";
			echo "var options = ".json_encode($options).";";
			echo "var chart = new google.visualization.BarChart(document.getElementById('chart_div'));";
			echo "chart.draw(data, options);";
			echo "}";
			echo "</script>";
		?>


		<!-- Identify where the chart should be drawn. -->
	 	<div id="myPieChart"/>


</body>
</html>
