Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » HTML » Refresco por tiempo

HTML - Refresco por tiempo

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil
Val: 5
Ha aumentado su posición en 26 puestos en HTML (en relación al último mes)
Gráfica de HTML

Refresco por tiempo

Publicado por Javier (27 intervenciones) el 20/03/2012 22:10:56
Buenas noches.
Estoy desarrollando una pagina la cual debe refrescar un mapa cada x segundos y representar una coordenada, utilizo openlayers.
Para ello he utilizado dos metodos:
El primero es <meta http-equiv="refresh" content="5"> que funciona pero no es muy estetico pues genera la pagina de nuevo.
El segundo con jquery :

Me parece mejor pero bloquea el equipo:

<script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function() { $("#ciclo").load("coord.php"); var refreshId = setInterval(function() { $("#ciclo").load('coord.php?aleatorio='+ Math.random()); }, 10000); });

</script>

A este segundo procedimiento, veis algo que genere ese bloqueo?.
Se os ocurre un metodo mas eficiente.
Mi intencion es que solo rfresque el mapa añadiendo la nueva coordenada.

Buenas noches.
Javier.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 1.144
Oro
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Refresco por tiempo

Publicado por xve (1543 intervenciones) el 21/03/2012 07:08:40
Hola Javier, la verdad, seguir tu código en una sola línea es un tanto complicado... tampoco entiendo muy bien que quieres decir con que "bloquea el equipo"...

Nosotros lo hacemo de otra manera, utilizando como tu la función setInterval del javascript, pero esta llama a una función que contiene el ajax.

1
2
3
4
5
6
7
function getContent()
{
    $.get("content.php", function(data) {
        $("#prod").html(data.prod);
    }, "json");
}
var int=self.setInterval("getContent()",1000);


Pego aqui tu código tabulado por si alguien lo quiere seguir...
1
2
3
4
5
6
$(document).ready(function() {
    $("#ciclo").load("coord.php");
    var refreshId = setInterval(function(){
        $("#ciclo").load('coord.php?aleatorio='+ Math.random());
    }, 10000);
});

Coméntanos si te sirve, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 5
Ha aumentado su posición en 26 puestos en HTML (en relación al último mes)
Gráfica de HTML

Refresco por tiempo

Publicado por Javier (27 intervenciones) el 22/03/2012 19:55:27
Gracias,
Disculpad lo del codigo en una linea, fue un corta/pega y no me di cuenta.
Lo voy a probar.
Una pregunta, ¿Qué debo instalar en el servidor, para ajax?. Me han comentado algo pero nada claro.

Un saludo,
Javier.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 5
Ha aumentado su posición en 26 puestos en HTML (en relación al último mes)
Gráfica de HTML

Refresco por tiempo

Publicado por Javier (27 intervenciones) el 22/03/2012 21:15:20
Por cierto, perdon por mi ignorancia, ¿donde deberia ir esto?:

var int=self.setInterval("getContent()",1000);


gracias de nuevo.
Javier
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 5
Ha aumentado su posición en 26 puestos en HTML (en relación al último mes)
Gráfica de HTML

Refresco por tiempo

Publicado por Javier (27 intervenciones) el 22/03/2012 22:35:53
He probado lo que me habeis indicado pero no es lo que yo esperaba.
Os explico, la pagina se encarga de leer datos de una tabla de mysql.
leo los datos latitud y longitud y los muestro en pantalla. Utilizo openlayers.
a los 10 segundos intento hacerlo de nuevo pero con esta funcion lo que hace es añadirme a continuacion otro mapa. La idea es que el mapa sea el mismo pero que modifique la capa ya existente con el nuevo dato.
La funcion para añadir un nuevo punto es:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function createMarkers(lonjs,latjs) {
 
	markersLayer = new OpenLayers.Layer.Markers( "Markers" );
 
	map.addLayer(markersLayer);
 
	var size = new OpenLayers.Size(5,5);
 
	var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
 
	var icon = new OpenLayers.Icon("imagenes/puntorojo.jpg",size,offset);
 
	markerPos= transformToSphericalMercator( new OpenLayers.LonLat(lonjs,latjs));
 
	marker=new OpenLayers.Marker(markerPos, icon);
 
	markersLayer.addMarker(marker);

En fin esto de lo que se ocupa es de pintar un punto en las coordenadas dadas y queda reflejado en un div que es el que deberia refrescar el mapa pero en cambio me crea un mapa nuevo a continuacion.
Espero que os oriente sobre el problema.

Si no sale en forma tabular, pido disculpas.

Un saludo,
Javier.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Refresco por tiempo

Publicado por Javier (1 intervención) el 06/10/2015 03:21:48
Estimados
Tengo un problema con respecto al tema que tocan, en mi caso tengo varios puntos los cuales se actualizan cada cierto tiempo mi probleme es que cuando realiza el refreso y justo ese momento estoy usando el wheel(ruedita del mouse) se generan multiples marcas, no se como resolver este problema
Este es mi codigo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
refreshPositions: function()
	{
		var self = this;
		setInterval(function(){
			//self.cleanMarkers();
			if(!self.isTracking)
			{
				self.loadCurrentPosition();
			}
			var now = Date.now();
			var date = new Date(now);
			console.log("OpenStreetMap: refreshPositions: " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds());
		}, 5000);
	},
 
 
OpenStreetMap.prototype.loadCurrentPosition = function ()
{
	console.log('OpenStreetMap.loadCurrentPosition');
	var self = this;
    $.ajax({
		url: 'index.php?r=site%2Fpositions',
		type: 'GET',
		dataType: "json",
		success : function(positions) {
			self.currentpositions =positions;
			self.showPointAllDevices();
		}
	});
};
 
 
OpenStreetMap.prototype.showPointAllDevices = function ()
{
	console.log('OpenStreetMap');
	var self = this;
 
	if(typeof self.currentpositions == 'undefined')
		return;
 
	self.cleanMarkers();
	$.each(self.currentpositions, function(index, point){
		var lon = point['longitude'];
        var lat = point['latitude'];
 
		var mposition = new OpenLayers.LonLat(lon, lat).transform(self.fromProjection, self.toProjection);
            var markerIcon = new OpenLayers.Icon('js/OpenLayers/img/marker-green.png');
            var marker = new OpenLayers.Marker(mposition, markerIcon);
		marker.popup = new OpenLayers.Popup.FramedCloud("osmpopup",
                    mposition,
                    new OpenLayers.Size(200, 200),
                    "points ",
                    null,
                    true);
 
            marker.events.register("click", marker, function(e) {
                self.map.addPopup(this.popup);
            });
            self.markers.addMarker(marker);
			//console.log(marker);
 
	});
};
 
	cleanMarkers : function()
	{
		var self = this;
		for(var mark in self.markers.markers)
		{
			self.markers.markers.splice(mark, 1);
			self.markers.removeMarker(self.markers.markers[mark]);
		}
	}

Alguna idea????
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar