PHP y JAVASCRIPT

Pinyo22 · #1 (**permalink**) 26/03/2008, 17:10

Estoy trabajando con Google map y quisiera integrar variables de PHP con JAVASCRIP y no tengo ni idea, ni de como se hace ni donde exponer el problema, asi es que me he decidido hacerlo en este foro que es con el que estoy mas familiarizado.

Las variables creadas con php serian:

$Latitud = 11111;
$Longitud = 22222;

$Latitud01 = 33333;
$Latitud02 = 55555;
$Latitudnn = nnnnn;
......
$Latitud99 = 77777;

$Longitud01 = 44444;
$Longitud02 = 66666;
$Longitudnn = nnnnn;
......
$Longitud99 = 88888;

Con las variables numeradas intento indicar que no sabemos de cuantos valores podremos disponer.

Asi en el programa quedaria como sigue ......

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Programa de pruebas</title>

    <script 

src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAAUYitxn0dTgDCq4jyCOwyBRedSTuckIKFb12qs9LHoiSCPxwXxRY8X1Vhyidf4QUkYLe_1EOCMMFbg"

      type="text/javascript"></script>

 
    <script type="text/javascript">

    //<![CDATA[

function load() {

        if (GBrowserIsCompatible()) {

                var map = new GMap2(document.getElementById("map"));

                map.setCenter(new GLatLng(11111,22222),11);

 
                var opciones_poligono = {geodesic:true};

 
                var V001 = new GLatLng(33333, 44444);

                var V002 = new GLatLng(55555, 66666);

                var Vnnn = new GLatLng(nnnnn, nnnnn);

                var V999 = new GLatLng(77777, 88888);

 
                var polyline = new GPolyline([V001,V002, Vnnn, ....  , V999]);

                map.addOverlay(polyline);

        }

}

 
window.onload=load

    //]]>

    </script>

  </head>

  <body onload="load()" onunload="GUnload()">

    <div id="map" style="width: 800px; height: 600px"></div>

  </body>

</html>

Ni que decir tiene que la linea
var polyline = new GPolyline([V001,V002, Vnnn, .... , V999]);
tendria que reducirse al maximo, (una tabla?????) ya que el numero de parametros puede ser muy alto.

De entrada gracias por leerlo.

chalchis · #2 (**permalink**) 27/03/2008, 00:55

que necesitas de php y que de javascript

¿las coordenadas las almacenas en base de datos?
debes indicar cual es tu inquitud o idea que quieras plasmar

para que puedas pasar variables de php a javascript ten encuenta que
lo que se ejecuta primero es el lenguaje del lado del servidor o sea php

<?php
$var='hola';
?>

<script>
var mivariable=<?echo $var;?>
</script>

saludos

Italico76 · #3 (**permalink**) 27/03/2008, 02:19

JS es del lado del cliente y PHP del lado del servidor.

Por tanto, tendrias que enviar los valores de las variables de JS a PHP por GET (en una url) o por POST.

Para enviar desde PHP a JS es facil porque simplemente haces un ECHO como te dice chalchis

Pinyo22 · #4 (**permalink**) 27/03/2008, 06:34

Ante todo muchas gracias.

Los valores los saco, unos de un archivo de texto y dos de ellos son el resultado de unos calculos.

Consultando por el foro, ya habia leido como se pasaban los parametros mediante el ECHO, pero el problema es que no conozco el JS y no se:

- En que punto del programa anterior tengo que crear las variables .
- Y como puedo reducir la linea a la que hago ref. a un solo parametro, ya que el nombre de las variables las creo en la primera parte com PHP y no cuantas variables puede haber.

Gracias.

farra · #5 (**permalink**) 27/03/2008, 06:41

si lo que queres es que el java se comunique con php sin tener que dar un submit a un formulario usa AJAX

Código HTML:

<Script>
function CrearXMLHttp(){
	XMLHTTP=false;
	if(window.XMLHttpRequest){
		return new XMLHttpRequest();
	}else if(window.ActiveXObject){
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
}

function OpenPage(url){
	req=CrearXMLHttp();
	if(req){
		req.onreadystatechange = manejador2;
		req.open("POST",url,true);
		req.send(null);
	}
}
function manejador2(){
	if(req.readyState == 4){
		if(req.status == 200){
			document.getElementById("tdc").innerHTML=req.responseText;
		}else{
			alert("Error"+req.statusText)
		}
	}
}
</Script>

y lo llamas asi por ejemplo:

Código HTML:

Onclick="OpenPage('paginaextractoradedatos.php')"

para que carge dentro del lugar especifico...

por ejemplo aca arga en el TD que tiene el Id="tdc"

Código HTML:

<table width="150" border="0">
  <tr>
    <td id="tdc">&nbsp;</td>
  </tr>
</table>

Italico76 · #6 (**permalink**) 27/03/2008, 07:10

Cita:

Los valores los saco, unos de un archivo de texto y dos de ellos son el resultado de unos calculos.

Eso puede ser un error porque cada "sesion" (usuario que navegue tu pagina) podria provocar que las variables tomen distintos valores.

Entonces.... el archivo de texto como refiere al resultado de la intereaccion de cada usuario ?

GatorV · #7 (**permalink**) 27/03/2008, 09:17

Puedes probar algo así:

Código PHP:

 
<script type="text/javascript">
    //<![CDATA[
function load() {
        if (GBrowserIsCompatible()) {
                var map = new GMap2(document.getElementById("map"));
                map.setCenter(new GLatLng(11111,22222),11);

                var opciones_poligono = {geodesic:true};
                var puntos = [];
                <?php
                      foreach( $points as $point ) {
                              echo "puntos.push( new GLatLng($point[0], $point[1]) );\n";
                      }
                ?>

                var polyline = new GPolyline(puntos);
                map.addOverlay(polyline);
        }
}

window.onload=load
    //]]>
    </script>

Tu variable $puntos tiene que ser un arreglo donde cada elemento sea un arreglo de dos elementos para x y y:

Código PHP:

  $puntos = array();
$puntos[0] = array( val_x, val_y );

Saludos.

Pinyo22 · #8 (**permalink**) 27/03/2008, 18:08

FARRA, te agradezco mucho tu interes, pero no soy muy experto en esto del PHP, asi que tus notas del AJAX están a años luz de mis conocimientos, espero poder ponerme algun dia a tu nivel.

ITALICO76, lo que pretendo es precisamente eso, se trata de mostrar mapas y cada usuario puede solicitar una zona diferente.

GATORV, he intentado seguir tus notas y me han hecho adelantar mucho en el trabajo, qunque en el tema de los arreglos / array / tablas, me he quedado justito, si alquien puede darle un vistazo .....

Código PHP:

 
html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Google Maps JavaScript API Example</title>

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAAUYitxn0dTgDCq4jyCOwyBRedSTuckIKFb12qs9LHoiSCPxwXxRY8X1Vhyidf4QUkYLe_1EOCMMFbg"

      type="text/javascript"></script>

 
    <script type="text/javascript">

    //<![CDATA[

function load() {

    if (GBrowserIsCompatible()) {

        var map = new GMap2(document.getElementById("map"));

 
<?php

    $NomFile = "tracks/080302AA.TRK";

    $lines = file($NomFile);

    $nl = 0 ;

    $puntos = array();

    

    foreach ($lines as $line_num => $line) {

        $datos = explode(" ", $line);

        If ($datos[0] == 'z'){

            $Long = 111111;

            $Lati = 222222;

 
            echo "map.setCenter(new GLatLng(".$Lati . "," .$Long . " ),11);";

            echo "map.addControl(new GLargeMapControl());"; 

            echo "map.addControl(new GMapTypeControl());"; 

            echo "var opciones_poligono = {geodesic:true};";

        } 

 
        If ($datos[0] == 'T'){

            $Lati = 3333333;

            $Long = 4444444;

            $puntos[$nl] = array( $Lati, $Long );  

            $nl = $nl+1;

        }

     }

?>

         var puntos = [];

 
 
         <?php

             foreach( $points as $point ) {

                 echo "puntos.push( new GLatLng($point[0], $point[1]) );\n";

             }

          ?>

 
           var polyline = new GPolyline(puntos);

        

            map.addOverlay(polyline);

    }

}

 
window.onload=load

    //]]>

    </script>

  </head>

<?

 
?>

  <body onload="load()" onunload="GUnload()">

    <div id="map" style="width: 800px; height: 600px"></div>

  </body>

</html>

Con esta rutina .

Código PHP:

  If ($datos[0] == 'T'){

    $Lati = 3333333;

    $Long = 4444444;

    $puntos[$nl] = array( $Lati, $Long );  

    $nl = $nl+1;

}

Crearia la tabla, naturalmente aqui se estan repitiendo los mismos valores en cada uno de los arrays. (Este lo tengo claro, aunque los datos sean ficticios)

Es aqui .....

Código PHP:

 
         var puntos = []; 

 
 
         <?php 

             foreach( $points as $point ) { 

                 echo "puntos.push( new GLatLng($point[0], $point[1]) );\n"; 

             } 

          ?> 

 
           var polyline = new GPolyline(puntos);

Donde no lo acabo de entender.

Saludos.

Pinyo22 · #9 (**permalink**) 30/03/2008, 02:52

Prueba superada.

Muchas gracias a todos, sobre todo a GATORV.