Foros del Web » Programando para Internet » PHP »

formulario para gestionar graficas

 Estas en el tema de formulario para gestionar graficas en el foro de PHP en Foros del Web. Hola amigos del foro, pues vengo con esta duda: estoy generando graficas con JSON y con HighCharts, y todo muy suabe ya se generan lo ...
  #1 (permalink)  
Antiguo 25/03/2014, 20:31
Avatar de elmoikano  
Fecha de Ingreso: enero-2013
Mensajes: 50
Antigüedad: 11 años, 11 meses
Puntos: 0
formulario para gestionar graficas
Hola amigos del foro, pues vengo con esta duda:

estoy generando graficas con JSON y con HighCharts, y todo muy suabe ya se generan lo gráficos correctamente; ahora la tabla que manejo tiene datos de diferentes años y quisiera saber somo podría hacer un formulario muy sencillo en el que sólo seleccione el año del que quiero la gráfica, hasta ahora tengo esto:

formulario html
Código HTML:
<form method="post" action="datacol.php">
	
	<select name="medio" tabindex="6">
					<option value='2014' selected>2014</option>
					<option value='2015' >2015</option>
					<option value='2016' >2016</option>
					<option value='2017' >2016</option>
					<option value='2018' >2016</option>
				</select>
	
	<input type="submit"/>
</form>
el action lo envío al archivo datacol.php que es el siguiente:
Código PHP:
<?php
$con = mysql_connect("localhost","root"," ");

if (!$con) {
  die('Could not connect: ' . mysql_error());
}

mysql_select_db("encuestas", $con);

$query = mysql_query("SELECT YEAR (fecha) as Y,MONTH(fecha) as MES, MONTHNAME(fecha) AS NOMBRE,fecha,  ROUND(AVG(profun),2) as profavg,ROUND(AVG(orden),2) as ordavg,ROUND(AVG(claridad),2) as claAVG,  ROUND(AVG(mat_didactico),2) as matavg,ROUND(AVG(ac_dudas),2) as acavg,ROUND(AVG(m_tiempo),2) as  mtavg from dbencuestas group by MES");

$category = array();
$category['name'] = 'MES';

$series1 = array();
$series1['name'] = 'Profundidad';

$series2 = array();
$series2['name'] = 'Orden';

$series3 = array();
$series3['name'] = 'Claridad';

$series4 = array();
$series4['name'] = 'Mat_Didáctico';

$series5 = array();
$series5['name'] = 'Aclara_Dudas';

$series6 = array();
$series6['name'] = 'Manejo_Tiempo';


while($r = mysql_fetch_array($query)) {
    $category['data'][] = date ("M-Y", strtotime ($r ['fecha'])); //date("g:i:s - A",strtotime($row['duracion']));
    $series1['data'][] = $r['profavg'];
    $series2['data'][] = $r['ordavg'];
    $series3['data'][] = $r['claAVG'];
    $series4['data'][] = $r['matavg'];  
    $series5['data'][] = $r['acavg'];  
    $series6['data'][] = $r['mtavg'];   
}

$result = array();
array_push($result,$category);
array_push($result,$series1);
array_push($result,$series2);
array_push($result,$series3);
array_push($result,$series4);
array_push($result,$series5);
array_push($result,$series6);


print json_encode($result, JSON_NUMERIC_CHECK);

mysql_close($con);
?>
este archivo es el que proporciona los datos para graficar en el archivo prom_satisfacción.php, pero no se como enviar datacol.php a este que es el que muestra el grafico
Código PHP:
        <script type="text/javascript">
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'container',
                    type: 'column',
                    marginRight: 130,
                    marginBottom: 25
                },
                title: {
                    text: 'Promedio de Satisfacción Mensual',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    categories: []
                },
                yAxis: {
                    title: {
                        text: '% satisfacción'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                            this.x +': '+ this.y +'%'; 
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                series: []
            }
            
            $.getJSON("datacol.php", function(json) {
                options.xAxis.categories = json[0]['data'];
                options.series[0] = json[1];
                options.series[1] = json[2];
                options.series[2] = json[3];
                options.series[3] = json[4];
                options.series[4] = json[5];
                options.series[5] = json[6];
                chart = new Highcharts.Chart(options);
            });
        });
        </script>
        
        
        <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script> 
Algúna idea? agradezco su ayuda.. Un cordial saludo.
__________________
Bibliotecario pero morboso de las Tecnologías....
  #2 (permalink)  
Antiguo 25/03/2014, 20:48
Avatar de loncho_rojas
Colaborador
  
Fecha de Ingreso: octubre-2008
Ubicación: En el mejor lugar del mundo
Mensajes: 2.704
Antigüedad: 16 años, 2 meses
Puntos: 175
Respuesta: formulario para gestionar graficas
Si el name es name="medio"

tendrías que recibir la variable $_GET['medio'];

$year= $_GET['medio']; y a tu consulta colocarle un WHERE

WHERE year = '".$year."' group by MES"

No se como se llama tu campo como para que puedas extraer el año que necesitas... solo como ejemplo... en todo caso si no es con tu DB tendrís que ver como usas esa variable MEDIO que trae consigo el valor del año para que te filtre ya sea el JSON o lo que uses, pero creo que puedes lograrlo ya en el SQL
__________________
Ayudo con lo que puedo en el foro, y solo en el foro.. NO MENSAJES PRIVADOS.. NO EMAILS NI SKYPE u OTROS.

Antes de hacer un TOPICO piensa si puedes hallarlo en Google o en el Buscador del Foro...
  #3 (permalink)  
Antiguo 26/03/2014, 19:12
Avatar de elmoikano  
Fecha de Ingreso: enero-2013
Mensajes: 50
Antigüedad: 11 años, 11 meses
Puntos: 0
Exclamación Respuesta: formulario para gestionar graficas
Hola loncho_rojas, gracias por tu ayuda amigo. claro como lo mencionas habia olvidado lo básico, jajaja ok, peo ahora queda la duda te explico con los códigos:

Mi idea es poner este combo en una pagina se llama grsficas.html y es sólo para establecer de que año quiero la gráfica:
Código HTML:
<form method="post" action="datacol.php">
	
	<select name="year" tabindex="6">
					<option value='2013' selected>2013</option>
					<option value='2014' >2014</option>
					<option value='2015' >2015</option>
					<option value='2016' >2016</option>
					<option value='2017' >2017</option>
					<option value='2018' >2018</option>
				</select>
	
	<input type="submit"/>
</form>
commo se ve en el action va hacia el archivo datacol.php, que es donde recibe la variable y esta la consulta:

Código PHP:
<?php
//recibe variable
$year = $_POST['year'];

//esta es mi consulta donde se colocaría el año que señalo en '%$year%'
$query = mysql_query("SELECT YEAR (fecha) as Y,MONTH(fecha) as MES, MONTHNAME(fecha) AS NOMBRE,fecha,
ROUND(AVG(profun),2) as profavg,ROUND(AVG(orden),2) as ordavg,ROUND(AVG(claridad),2) as claAVG, 
ROUND(AVG(mat_didactico),2) as matavg,ROUND(AVG(ac_dudas),2) as acavg,ROUND(AVG(m_tiempo),2) as  
mtavg from dbencuestas WHERE fecha LIKE '%$year%' GROUP by MES");
// y el arreglo y demas
$category = array();
$category['name'] = 'MES';

$series1 = array();
$series1['name'] = 'Profundidad';

$series2 = array();
$series2['name'] = 'Orden';

$series3 = array();
$series3['name'] = 'Claridad';

$series4 = array();
$series4['name'] = 'Mat_Didáctico';

$series5 = array();
$series5['name'] = 'Aclara_Dudas';

$series6 = array();
$series6['name'] = 'Manejo_Tiempo';


while($r = mysql_fetch_array($query)) {
    $category['data'][] = date ("M-Y", strtotime ($r ['fecha'])); //date("g:i:s - A",strtotime($row['duracion']));
    $series1['data'][] = $r['profavg'];
    $series2['data'][] = $r['ordavg'];
    $series3['data'][] = $r['claAVG'];
    $series4['data'][] = $r['matavg'];  
    $series5['data'][] = $r['acavg'];  
    $series6['data'][] = $r['mtavg'];   
}

$result = array();
array_push($result,$category);
array_push($result,$series1);
array_push($result,$series2);
array_push($result,$series3);
array_push($result,$series4);
array_push($result,$series5);
array_push($result,$series6);


print json_encode($result, JSON_NUMERIC_CHECK);

mysql_close($con);
?>
hasta aqui tío de este odo super, el lio es que no se como hacer el envío de este archivo al prom_satisfaccion.php, que es donde recibe el JSON y grafica los resultados obtenidos en la encuesta (la grafica la genero con la librería HighCharts) y este es el archivo que recibe los resultados de la consulta:

Código PHP:
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Column chart with data from MySQL using Highcharts</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'container',
                    type: 'column',
                    marginRight: 130,
                    marginBottom: 25
                },
                title: {
                    text: 'Promedio de Satisfacción Mensual',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    categories: []
                },
                yAxis: {
                    title: {
                        text: '% satisfacción'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                            this.x +': '+ this.y +'%'; 
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                series: []
            }
            
            $.getJSON("datacol.php", function(json) {
                options.xAxis.categories = json[0]['data'];
                options.series[0] = json[1];
                options.series[1] = json[2];
                options.series[2] = json[3];
                options.series[3] = json[4];
                options.series[4] = json[5];
                options.series[5] = json[6];
                chart = new Highcharts.Chart(options);
            });
        });
        </script>
        
        
        <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script>
        
    </head>
    <body>
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
</html> 
algúna idea???
__________________
Bibliotecario pero morboso de las Tecnologías....

Etiquetas: fecha, formulario, gestionar, html, mysql, select, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 19:11.