Gráficos en tiempo real XML PHP

juniorhernandezg · #1 (**permalink**) 10/05/2012, 17:59

Buenas noches,

Amigos les quería preguntar que me recomiendan para graficar en tiempo real tres variables que genera cambios constante ya que es un XML que se genera de unos equipos de comunicaciones.

Saludos

GatorV · #2 (**permalink**) 10/05/2012, 18:01

Es mejor algo en el cliente, yo te recomendaría jQueryFlot, vía AJAX puedes hacer una petición al XML y graficar al momento.

Saludos.

juniorhernandezg · #3 (**permalink**) 10/05/2012, 20:23

Descargue el Script Flot pero el codigo ejemplo para el Realtime no me muestra donde incluso el archivo xml y sus variables para que la grafica actue.

Este es el codigo ejemplo del grafico en RealTime:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Flot Examples</title>
    <link href="layout.css" rel="stylesheet" type="text/css">
    <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->
    <script language="javascript" type="text/javascript" src="../jquery.js"></script>
    <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
 </head>
    <body>
    <h1>Flot Examples</h1>

    <div id="placeholder" style="width:600px;height:300px;"></div>

    <p>You can update a chart periodically to get a real-time effect
    by using a timer to insert the new data in the plot and redraw it.</p>

    <p>Time between updates: <input id="updateInterval" type="text" value="" style="text-align: right; width:5em"> milliseconds</p>

<script type="text/javascript">
$(function () {
    // we use an inline data source in the example, usually data would
    // be fetched from a server
    var data = [], totalPoints = 300;
    function getRandomData() {
        if (data.length > 0)
            data = data.slice(1);

        // do a random walk
        while (data.length < totalPoints) {
            var prev = data.length > 0 ? data[data.length - 1] : 50;
            var y = prev + Math.random() * 10 - 5;
            if (y < 0)
                y = 0;
            if (y > 100)
                y = 100;
            data.push(y);
        }

        // zip the generated y values with the x values
        var res = [];
        for (var i = 0; i < data.length; ++i)
            res.push([i, data[i]])
        return res;
    }

    // setup control widget
    var updateInterval = 30;
    $("#updateInterval").val(updateInterval).change(function () {
        var v = $(this).val();
        if (v && !isNaN(+v)) {
            updateInterval = +v;
            if (updateInterval < 1)
                updateInterval = 1;
            if (updateInterval > 2000)
                updateInterval = 2000;
            $(this).val("" + updateInterval);
        }
    });

    // setup plot
    var options = {
        series: { shadowSize: 0 }, // drawing is faster without shadows
        yaxis: { min: 10, max: 100 },
        xaxis: { show: false }
    };
    var plot = $.plot($("#placeholder"), [ getRandomData() ], options);

    function update() {
        plot.setData([ getRandomData() ]);
        // since the axes don't change, we don't need to call plot.setupGrid()
        plot.draw();
        
        setTimeout(update, updateInterval);
    }

    update();
});
</script>

GatorV · #4 (**permalink**) 10/05/2012, 21:45

Pues precisamente eso es lo que tienes que programar, no hay un ejemplo así que funcione para tu caso, pero ya tienes la base, solo es cuestión que lo apuntes a tu XML y lo parsees.

Saludos.

juniorhernandezg · #5 (**permalink**) 11/05/2012, 07:16

Chevere, te muestro el codigo PHP que me extrae del XML las tres variables que quiero usar.

Las variables son $Critical $Major y $Minor

Código:

<?php

$url = "C:\TelnetWS3\AlarmasXML.xml";
$contenido_xml = "";
if($d = fopen($url, "r")){
 while ($aux= fgets($d, 1024)){
    $contenido_xml .= $aux;
  }
	  fclose($d);
	}else{
	  echo "No se pudo abrir el XML";
	}
	
	$xml =simplexml_load_string ($contenido_xml);  

	 
?>
	
	<?php
	$contenido_xml = str_replace('MAJOR', 'Major', $contenido_xml);
	preg_match_all('/<Severidad>(.*?)<\/Severidad>/si', $contenido_xml, $res);
    $repeticiones = array_count_values($res[1]);
	$Critical =$repeticiones['Critical'];
	$Major =$repeticiones['Major'];
	$Minor =$repeticiones['Minor'];
	?>
	
	<font face="verdana" size="2" color="#FF0000"><b>Critical: <? echo $Critical;?></b>
	<font face="verdana" size="2" color="#FF0000"><b>Major: <? echo $Major;?></b>
	<font face="verdana" size="2" color="#FF0000"><b>Minor: <? echo $Minor;?></b>

Estas variables las debo tomar e insertar en el codigo del Flot pero no sé como.

Gracias, saludos