Construyendo un verdadero triple click con jQuery

4 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: ,

En Ajaxian me he encontrado un interesante artículo denominado "Building a triple click" en el que se hace mención al código creado por Brandon Aaron para, ayudado por jQuery, asignar un evento al triple click de un elemento. La verdad es que resulta interesante no restringir la llamada de acciones únicamente al click o el doble click. El código sería: 

jQuery.event.special.tripleclick = {
    setup: function(data, namespaces) {
        var elem = this, $elem = jQuery(elem);
        $elem.bind('click', jQuery.event.special.tripleclick.handler);
    },
    teardown: function(namespaces) {
        var elem = this, $elem = jQuery(elem);
        $elem.unbind('click', jQuery.event.special.tripleclick.handler);
    },
    handler: function(event) {
        var elem = this,
	$elem = jQuery(elem),
	clicks = $elem.data('clicks') || 0;
        clicks += 1;
        if ( clicks === 3 ) {
            clicks = 0;
            event.type = "tripleclick";
            jQuery.event.handle.apply(this, arguments)
        }
        $elem.data('clicks', clicks);
    }
};

Y una posible llamada podría ser: 

$(document).ready(function() {
   $('#ejemplo').bind('tripleclick', function(event) {
   alert('TRES CLICKS!!!!!');
  });
});

Ver ejemplo en funcionamiento » »

El problema del script es que no importa cuanto tiempo se tarde en acumular los tres clicks. Puede haber un minuto entre click y click, que al sumar tres el evento se desencadenará. De un modo similar a un código que utilicé para simular un doble click en Flash, he modificado el código original para construir un evento que se desencadene cuando se cumpla un verdadero click. El ejemplo toma un intervalo máximo entre click y click de 500 milisegundos pero éste es fácilmente personalizable. El código resultante sería: 

jQuery.event.special.tripleclick = {
    setup: function(data, namespaces) {
        var elem = this, $elem = jQuery(elem);
        $elem.bind('click', jQuery.event.special.tripleclick.handler);
    },
    teardown: function(namespaces) {
        var elem = this, $elem = jQuery(elem);
        $elem.unbind('click', jQuery.event.special.tripleclick.handler);
    },
    handler: function(event) {
        var elem = this,
	$elem = jQuery(elem),
	clicks = $elem.data('clicks') || 0;
	//Averiguamos cuando fue el click anterior
	ClickAnterior = $elem.data('ClickTiempo') || 0;
	//Extraemos el tiempo de este click	
	var d = new Date();
	var ClickTiempo=d.getTime();
	//Comparamos a ver si han pasado 500 milisegundos
	if (ClickTiempo <= (ClickAnterior + 500)) {
		//si no han pasado, sumamos un click
		clicks += 1;
	}else{
		//si han pasado 500 milisegundos
		//reiniciamos el contador a uno
		clicks = 1;
	}
	$('#ejemplo').html('Clicks: '+clicks);
       if ( clicks === 3 ) {
            clicks = 0;
            event.type = "tripleclick";
            jQuery.event.handle.apply(this, arguments)
        }
        $elem.data('clicks', clicks);
        $elem.data('ClickTiempo', ClickTiempo);
    }
};

Ver ejemplo en funcionamiento » »

Algunas entradas relacionadas:

 

30 Tips para Photoshop

5 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: ,

En Internet existe múltiples listas de este tipo. Tips o pequeños consejos, que junto con la recomendación del uso de determinados atajos de teclado pueden hacer que nuestro trabajo en Photoshop sea más eficiente. En este sentido, el listado que a continuación se presenta no es nada original. Tampoco pretende serlo, puesto que tan sólo es una selección. De entre los cientos de tips y atajos de teclado que uno puede encontrarse a poco que busque un poco, son los que yo utilizo si no en el día a día si que con bastante frecuencia.

1.- ¿Cansado del fondo gris predeterminado que rodea a las imágenes?¿Te gustaría otro color para lograr un mayor contraste con la imagen sobre la que estás trabajando? Elige el color que te gustaría como fondo, haz click en el botón de pintura y con la tecla mayúsculas presionada haz click sobre el fondo gris.

2.- En Photoshop todos los botones de "Cancelar" en cualquier ventana pueden cambiarse a "Restaurar" para volver a los valores iniciales.

3.- Presiona el tabulador para ocultar la barra de herramientas y las paletas.

4.- Presiona MAYUS+Tabulador si únicamente deseas esconder las paletas.

5.- Haz click con la tecla MAYÚSCULAS presionada sobre la barra azul superior en las paletas o barra de herramientas para que éstas se alineen con el borde más próximo a ellas.

6.- Haz doble click sobre la barra azul superior sobre cualquier paleta para minimizarla.

7.- Presiona la tecla F para alternar entre 3 modos de pantalla diferentes y así poder obtener un mayor área de trabajo.

8.- Para dibujar una línea recta, haz click en el punto inicial, muévete hasta el punto final y haz click con la tecla MAYÚSCULAS presionada.

9.- Estando trabajando con cualquier herramienta, presiona la tecla CTRL para pasar a la herramienta Mover de modo temporal. Al soltar la tecla CTRL volverás a la herramienta con la que estabas trabajando.

10.- Estando trabajando con cualquier herramienta, presiona la tecla ESPACIO para pasar a la herramienta Mano de modo temporal. Al soltar la tecla ESPACIO volverás a la herramienta con la que estabas trabajando.

11.- Presionando CTRL+ESPACIO pasas a la herramienta de Zoom en modo aumentar.

12.- Presionando ALT-ESPACIO pasas a la herramienta Zoom en modo disminuir.

13.- CTRL+D Deselecciona. CTRL+MAYUS+D vuelve a seleccionar. CTRL+MAYUS+I invierte la selección.

14.- Presiona la tecla ALT y haz click sobre el icono del ojo que hay al lado de todas las capas en la paleta de capas para ocultar/mostrar todas las otras capas.

15.- Si la capa con la que vas a trabajar está enlazada con otras capas y necesitas desenlazarla, puedes hacerlo rápidamente pulsando la tecla ALT y a continuación hacer click en el pincel que hay al lado de la capa en la paleta de capas.

16.- CTRL+ALT+Z y CTRL+MAYUS+Z van, respectivamente, hacia atrás y hacia adelante en el historial.

17.- Si tienes varios documentos abiertos, con CTRL+TABULADOR podrás ir pasando de unos a otros.

18.- Doble click en la herramienta de zoom hará la imagen al 100 %, doble click en la herramienta mano ajustará la imagen al espacio disponible, dependiendo de la resolución de tu pantalla.

19.- CTRL+MAYSU+E combinará todas las capas visibles. Sobre una capa nueva utiliza CTR+MAYUS+ALT+E para combinar todas las capas visibles en ésta y dejar intactas las originales.

20.- Al utilizar el marco de selección, presiona la tecla ALT al iniciar la selección para que el punto de partida sea el centro de la selección.

21.- CTRL+ALT+T para hacer una copia de la capa que deseas transformar.

22.- Presionando X se alternarán los colores frontales y de fondo seleccionados.

23.- Presionando D se reestablecerá el color frontal y de fondo a negro y blanco.

24.- Presiona CTRL y haz click sobre la miniatura de una capa para seleccionar su contenido.

25.- Cuando utilizas el Lazo Poligonal presiona la tecla MAYUSCULAS para realizar líneas perfectas en ángulos de 45 grados.

26.- Las combinaciones de teclas CTRL+'+' y CTRL+'-' sirven para aumentar el zoom y reducir el zoom respectivamente.

27.- Con la herramienta Cuentagotas puedes capturar un color frontal haciendo click, puedes capturar un color de fondo haciendo click con la tecla ALT presionada.

28.- Con la herramienta de Medición dibuja una línea. A continuación presiona la tecla ALT para dibujar otra línea a continuación de la primera. Photoshop, además de medir la distancia de esta segunda línea, mostrará el ángulo que forman ambas líneas.

29.- Si estás editando texto puedes aumentar el tamaño del texto sin necesidad de recurrir a la paleta. Selecciona el texto sobre el que deseas cambiar el tamaño y presiona CTRL+MAYUS+'+' para aumentar el tamaño y CTRL+MAYUS+'-' para disminuir el tamaño.

30.- La Herramienta de Tampón de clonar también funciona cuando tienes varias imágenes abiertas al mismo tiempo. Presiona ALT y haz click en un área de cualquier imagen de un archivo abierto y posteriormente puedes pintar en cualquier otro documento.

Algunas entradas relacionadas:

 

Exportar tablas HTML a Excel con PHP y JQuery

22 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: , , , ,

En un post anterior vimos cómo usando una clase podíamos Crear hojas de cálculo Excel con PHP. En este post vamos a ver cómo utilizar jQuery para exportar los datos de una tabla a Excel. El tutorial es una adaptación de lo explicado en un post de TopSEMLTips. Lo primero que necesitamos es importar jQuery: 

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

Lo siguiente es tener una tabla en HTML que deseamos exportar a Excel. Puesto que luego lo utilizaremos, necesitamos asignarle un identificador a la tabla, por ejemplo id="Exportar_a_Excel". 

<table id="Exportar_a_Excel">
<tr>
     <td>Celda1</td>
     <td>Celda2</td>
     <td>Celda3</td>
     <td>Celda4</td>
     <td>Celda5</td>
</tr><tr>
     <td>Celda6</td>
     <td>Celda7</td>
     <td>Celda8</td>
     <td>Celda9</td>
     <td>Celda10</td>
</tr>
</table>

Lo siguiente es crear un formulario, también con un identificador para almacenar el contenido de la tabla en un campo oculto y posteriormente enviarlo al php que generará la hoja de cálculo. 

<form action="ficheroExcel.php" method="post" target="_blank" id="FormularioExportacion">
<p>Exportar a Excel  <img src="export_to_excel.gif" class="botonExcel" /></p>
<input type="hidden" id="datos_a_enviar" name="datos_a_enviar" />
</form>

Ahora necesitaremos volcar toda la tabla en el campo oculto y enviar el formulario. Para ello nos servimos de jQuery: 

<script language="javascript">
$(document).ready(function() {
     $(".botonExcel").click(function(event) {
     $("#datos_a_enviar").val( $("<div>").append( $("#Exportar_a_Excel").eq(0).clone()).html());
     $("#FormularioExportacion").submit();
});
});
</script>

El fichero php recogerá el contenido del campo oculto "datos_a_enviar" y lo mostrará con el content-type apropiado. Así pues, ficheroExcel.php sería: 

<?php
header("Content-type: application/vnd.ms-excel; name='excel'");
header("Content-Disposition: filename=ficheroExcel.xls");
header("Pragma: no-cache");
header("Expires: 0");
echo $_POST['datos_a_enviar'];
?>

Ver ejemplo en funcionamiento » »

Descargar ejemplo completo » »

Algunas entradas relacionadas:

 

Crear hojas de cálculo Excel con PHP

10 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: , , ,

Existen varias formas de exportar a Excel mediante PHP. En este post vamos a servirnos de la clase Excel Writer. La clase es muy sencilla de utilizar y nos puede permitir realizar el proceso de exportación de una tabla de nuestra base de datos sin grandes complicaciones. Primero veamos un ejemplo básico muy ilustrativo del funcionamiento de la clase. 

<php
include("excelwriter.inc.php"); 
$excel=new ExcelWriter("FicheroExcel.xls");

if($excel==false) { 
   echo $excel->error;
}

// PRIMERA FORMA DE ESCRITURA DE FILAS
$myArr=array("CeldaA1","CeldaB1","CeldaC1","CeldaD1");
$excel->writeLine($myArr);

$myArr=array("CeldaA2","CeldaB2","CeldaC2","CeldaD2");
$excel->writeLine($myArr);

//SEGUNDA FORMA DE ESCRITURA DE FILAS
$excel->writeRow();
$excel->writeCol("CeldaA3");
$excel->writeCol("CeldaB3");
$excel->writeCol("CeldaC3");
$excel->writeCol("CeldaD3");

$excel->writeRow();
$excel->writeCol("CeldaA4");
$excel->writeCol("CeldaB4");
$excel->writeCol("CeldaC4");
$excel->writeCol("CeldaD4");

$excel->close();
echo "Los datos se han grabado con éxito.";
?>

Descargar ejemplo completo » »

Supongamos ahora que tenemos una tabla con una serie de comercios y deseamos poder exportarla, para uso propio o porque el cliente nos lo ha pedido, a una hoja de cálculo Excel. Un ejemplo de utilización de la clase Excel Writer para exportar datos de una tabla de una base de datos MySQL sería: 

<?php
include("includes/excelwriter.inc.php");

$excel=new ExcelWriter("galeria_comercial.xls");

if($excel==false) {
echo $excel->error;
}

//Escribimos la primera fila con las cabeceras
$myArr=array("Nombre Comercial","Direccion","CP","Localidad","Telefono","Email");
$excel->writeLine($myArr);

//REALIZAMOS LA CONSULTA
$dbhost = "localhost";
$dbuser = "usuario";
$dbpassword = "password";
$dbname = "base_de_datos";

$db2 = mysql_connect($dbhost, $dbuser, $dbpassword) or die("Connection Error: " . mysql_error());
mysql_select_db($dbname) or die("Error al conectar a la base de datos.");
$sql2 = "SELECT * FROM ComerciosGaleria";
$sql2 .= " ORDER BY NombreComercial ASC ";
$result2 = mysql_query( $sql2) or die("No se puede ejecutar la consulta: ".mysql_error());

//Escribimos todos los registros de la base de datos
//en el fichero EXCEL
while($Rs2 = mysql_fetch_array($result2)) {
$myArr=array(
$Rs2['Nombre_Comercial'],
$Rs2['Direccion'],
$Rs2['CodigoPostal'],
$Rs2['Localidad'],
$Rs2['Telefono'],
$Rs2['Email']
);
$excel->writeLine($myArr);
//Otra forma es
//$excel->writeLine($Rs2);
//De este modo volcariamos todos los registros seleccionados
//Sin necesidad de colocarlos/filtrar previamente en $myArr
}
$excel->close();

//Abrimos el fichero excel que acabamos de crear
header("location:galeria_comercial.xls");
?>

Algunas entradas relacionadas:

 

highlight_file: resaltar código PHP

0 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: ,

A la hora de mostrar trozos de código en una web o blog tenemos muchas formas de hacerlo. En este post vamos a ver la función de php highlight_file que sirve para ofrecer código de forma resaltada, con diversos colores que faciliten su lectura. Vamos a ver un poco el funcionamiento de la función highlight_file, que realiza un resaltado de sintaxis de un archivo. Sintaxis: 

highlight_file  ( string $nombre_archivo  [, bool $devolver  ] )

Imprime o devuelve una versión con resaltado de sintaxis del código contenido en nombre_archivo usando los colores definidos en el resaltador de sintaxis incorporado de PHP.

El parámetro "nombre_archivo" es la ruta al archivo PHP a ser coloreado. El parámetro "devolver" establecido como TRUE hace que la función devuelva el código resaltado. Si se establece como FALSE, devolverá TRUE si tiene éxito, o FALSE en caso de fallo.

Veamos un ejemplo. Tenemos un archivo denominado "fichero.php" con: 

<?php
require'EasyGoogleMap.class.php';
$key ="XXXXXXXXXX";
$gm = & new EasyGoogleMap($key);
$gm->SetMapZoom(15);
$gm->SetAddress("Colon 22, Valencia");
$gm->SetInfoWindowText("Esta es la primera dirección");
$gm->SetAddress("Periodista Azzati 7, Valencia");
$gm->SetInfoWindowText("Esta es la segunda dirección");
?>
<html>
<head>
<title>EasyGoogleMap</title>
<?php echo $gm->GmapsKey(); ?>
</head>
<body>
<?php echo $gm->MapHolder(); ?>
<?php echo $gm->InitJs(); ?>
<?php echo $gm->UnloadMap(); ?>
</body>
</html>

Para mostrar este fichero en nuestra web de un modo resaltado lo haríamos de un modo parecido al siguiente: 

<p>Este es un código de ejemplo utilizando la función <strong>highlight_file:</strong></p>
<?php
highlight_file ("fichero.php");
?> 
<p>Como se puede apreciar el código ha aparecido con la sintaxis resaltada. </p>

Ver ejemplo en funcionamiento » »

La utilización de la función es muy simple, pero siempre podemos enriquecerla un poco más. Por ejemplo, en PHP.net nos muestran una forma de enriquecerla ofreciendo los números de línea: 

<style type="text/css">
.num {
float: left;
color: gray;
text-align: right;
margin-right: 6pt;
padding-right: 6pt;
border-right: 1px solid gray;}
</style>
<?php
function highlight_num($file) {
     echo '<code class="num">', implode(range(1, count(file($file))), '<br />'), '</code>';
     highlight_file($file);
}
highlight_num('fichero.php');
?>

Ver ejemplo en funcionamiento » »

También podemos utilizar la función highlight_string para realizar el resaltado de sintaxis de una cadena -la cadena debe incluir la etiqueta de apertura-: 

<?php
highlight_string('<?php
require"EasyGoogleMap.class.php";
$key ="XXXXXXXXXX";
$gm = & new EasyGoogleMap($key);
$gm->SetMapZoom(15);
$gm->SetAddress("Colon 22, Valencia");
$gm->SetInfoWindowText("Esta es la primera dirección");
$gm->SetAddress("Periodista Azzati 7, Valencia");
$gm->SetInfoWindowText("Esta es la segunda dirección");
?>')
?>

Ver ejemplo en funcionamiento » »

Algunas entradas relacionadas:

 

Ajax con jQuery: el método load()

17 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: , ,

jQuery ofrece bastantes funcionalidades Ajax que nos pueden facilitar mucho la tarea de enviar y recoger peticiones asíncronas al servidor. Quizá la sentencia más simple de JQuery para cargar contenido mediante Ajax es load(). Este post trata de ofrecer una explicación sencilla de este comando, así como de unos cuantos ejemplos sencillos pero representativos de su uso. Sintaxis: 

load(url,parametros,callback)

Inicia una solicitud Ajax a la URL especificada con parámetros opcionales. Se puede especificar una función de callback que puede ser invocada cuando la solicitud se completa. El texto de respuesta reemplaza el contenido de todos los elementos coincidentes.

Argumentos:

  • url: La URL a la que la solicitud es enviada.
  • parámetros: Un objeto cuyas propiedades son serializadas en una serie de parámetros codificados correctamente y que se pasan a la solicitud. Se utiliza si se especifica, que la petición se hace utilizando el método POST. Se omite si se utiliza el método GET.
  • callback: Una función invocada después de que la solicitud ha sido procesada.

Por ejemplo 

$("#contenido").load("archivo.html");

Cargaría el contenido de "archivo.html" en el div "contenido". Un ejemplo un poco más elaborado y completo podría ser el siguiente: 

<html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>JQuery Ajax</title>
  <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
  <script type="text/javascript">

  $(document).ready(function() {
$(".boton").click(function(event) {
$("#caja").load('carga.html',aviso());
});
});
function aviso(){
alert('La solicitud ha sido procesada');
}
</script>
</head>
<body>
<p><input name="bt1" type="button" value="CARGA CONTENIDO" class="boton"/></p>
<div id="caja" style="padding:5px;border:1px solid #CCC;">
</div>
</body>
</html>

Ver ejemplo en funcionamiento » »

Aunque fácil de usar, este comando tiene algunos matices importantes. Por ejemplo, cuando se alimenta el argumento "parámetros" la solicitud se realiza mediante el método HTTP POST, de lo contrario, se realiza mediante una petición GET. Si queremos realizar una solicitud GET con los parámetros, podemos incluirlos en la URL. En este último caso deberemos asegurarnos de que la url esté correctamente codificada.

En el siguiente ejemplo utilizamos el valor del atributo "value" de tres botones para pasarle a un archivo .php la acción que desearíamos ejecutar. El archivo que invoca mediante Ajax el archivo .php sería: 

<?php
if($_POST['acc']=='EDITAR'){
	// ACCIONES DE EDICION
	echo 'LA ACCION SOLICITADA ES EDITAR';
}elseif($_POST['acc']=='NUEVO'){
	// ACCIONES DE CREACION
	echo 'LA ACCION SOLICITADA ES NUEVO';
}else{
	// ACCIONES DE ELIMINACION
	echo 'LA ACCION SOLICITADA ES BORRAR';
}
?>

Y el archivo "solicitud.php" se encargaría de recoger los parámetros por POST y asignar las acciones pertinentes: 

<?php
if($_POST['acc']=='EDITAR'){
	// ACCIONES DE EDICION
	echo 'LA ACCION SOLICITADA ES EDITAR';
}elseif($_POST['acc']=='NUEVO'){
	// ACCIONES DE CREACION
	echo 'LA ACCION SOLICITADA ES NUEVO';
}else{
	// ACCIONES DE ELIMINACION
	echo 'LA ACCION SOLICITADA ES BORRAR';
}
?>

Ver ejemplo en funcionamiento » »

La mayoría de veces utilizaremos el comando load() para inyectar el contenido completo de la respuesta, pero puede ocurrir que deseemos filtrar la respuesta. jQuery nos permite especificar un selector en la URL para filtrar los elementos que van a ser inyectados. Por ejemplo: 

$('#contenido').load('recurso.html #bloque_1')

La respuesta contenida en el div "bloque_1" del fichero "recurso.html", será cargada en el div "contenido".

En el siguiente ejemplo se cargan unicamente los enlaces contenidos en el fichero "carga_filtrada.html". 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>JQuery Ajax
<script type="text/javascript" src="jquery-1.3.2.min.js">
<script type="text/javascript">
$(document).ready(function() {
	$(".boton").click(function(event) {
			  $("#caja").load('carga_filtrada.html a');
	});
});
</script>
<style type="text/css">
a {display:block;}
</style>
</head>
<body>




</div>
</body>
</html>

Y el fichero "carga_filtrada.html" sería: 

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum sed diam nonumy eirmod tempor invidunt ut labor. Stet clita kasd gubergren consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua

Ver ejemplo en funcionamiento » »

Algunas entradas relacionadas:

 

Easy Google Maps: clase PHP para facilitar el uso de la API de Google Maps

12 COMENTARIOS -  Publicado hace 12 meses -  Clasificado en: , ,

Easy Google Maps es una clase para PHP que, como su nombre indica facilita la inclusión de mapas a través de Google Maps en un sitio web. Lo primero que deberemos hacer, para poder utilizar la API de Google Maps es obtener una key o clave para el dominio en el que pensemos utilizar la API.

Una vez tenemos una key podemos invocar un mapa de un modo tan sencillo como: 

<?php
require'EasyGoogleMap.class.php';
$key ="XXXXXXXXXX";
$gm = & new EasyGoogleMap($key);
$gm->SetMapZoom(15);
$gm->SetAddress("Colon 22, Valencia");
$gm->SetInfoWindowText("Esta es la primera direcci&oacute;n");
$gm->SetAddress("Periodista Azzati 7, Valencia");
$gm->SetInfoWindowText("Esta es la segunda direcci&oacute;n");
?>
<html>
<head>
<title>EasyGoogleMap</title>
<?php echo $gm->GmapsKey(); ?>
</head>
<body>
<?php echo $gm->MapHolder(); ?>
<?php echo $gm->InitJs(); ?>
<?php echo $gm->UnloadMap(); ?>
</body>
</html>

Donde "XXXXXXXXXX" es la key que acabamos de obtener.
Ver ejemplo en funcionamiento » »

Algunas de las propiedades que podemos establecer son las siguientes: 

//Para habilitar/deshabilitar el zoom progresivo.
// De modo predeterminado deshabilitado (FALSE)
$gm->mContinuousZoom = FALSE;

//Para habilitar/deshabilitar La escala del mapa.
// De modo predeterminado habilitado (TRUE)
$gm->mScale = TRUE;
//Para habilitar/deshabilitar el mapa interno.
// De modo predeterminado deshabilitado (FALSE)
$gm->mInset = FALSE;
//Para habilitar/deshabilitar el tipo de mapa.
// De modo predeterminado deshabilitado (FALSE)
$gm->mMapType = FALSE; # default
//Para establecer las dimensiones del mapa
//De modo predeterminado 300px x 300px
$gm->SetMapWidth(500); 
$gm->SetMapHeight(500);
//Para establecer el zoom
//De modo predeterminado 13
$gm->SetMapZoom(10);
//Para establecer el tipo de puntero
// De modo predeterminado se utiliza GT_FLAT
$gm->SetMarkerIconStyle('FLAG');
$gm->SetMarkerIconStyle('GT_FLAT');
$gm->SetMarkerIconStyle('GT_PILLOW');
$gm->SetMarkerIconStyle('HOUSE');
$gm->SetMarkerIconStyle('PIN');
$gm->SetMarkerIconStyle('PUSH_PIN');
$gm->SetMarkerIconStyle('STAR');

//Para establecer el color del puntero
// De modo predeterminado se utiliza PACIFICA
$gm->SetMarkerIconColor('PACIFICA');
$gm->SetMarkerIconColor('YOSEMITE');
$gm->SetMarkerIconColor('MOAB');
$gm->SetMarkerIconColor('GRANITE_PINE');
$gm->SetMarkerIconColor('DESERT_SPICE');
$gm->SetMarkerIconColor('CABO_SUNSET');
$gm->SetMarkerIconColor('TAHITI_SEA');
$gm->SetMarkerIconColor('POPPY');
$gm->SetMarkerIconColor('NAUTICA');
$gm->SetMarkerIconColor('DEEP_JUNGLE');
$gm->SetMarkerIconColor('SLATE');

//Establecer el texto del bocadillo informativo
$gm->SetInfoWindowText("Este es el punto uno")

El uso es realmente sencillo. Lo unico que no me acababa de gustar es que apareciese el bocadillo de la primera dirección. Prefiero que aparezcan los bocadillos cuando el usuario hace click. Simplemente cogiendo la clase y comentando estas dos líneas ya lo tendremos, 

if ($i===0) 
$ret .= "marker.openInfoWindowHtml(address_$i.infowindowtext);\n";

Ver un segundo ejemplo en funcionamiento » »

Descargar ejemplo completo » »

Algunas entradas relacionadas:

 
Páginas: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 Siguiente >