Utilizar google maps

Alguien podría orientarme en como utilizar mapas de google en un formulario de Toba en el cual tengo direcciones de personas?
Gracias.

Hola Nicolas,

seguramente tengas que modificar el layout del formulario para dejar el contenedor para el mapa en algun lugar (que luego se cargara via js), mas alla de eso… toda la interaccion la vas a tener que hacer via JS, asumiendo que el mapa es solo un elemento visual y que no interactua directamente con nada en el server.

Eso implica que vas a tener que definir comportamiento para los evt__xx_procesar de los distintos campos (y algun boton inclusive) y manejar el mapa via la API del mismo, como es un elemento externo al formulario, no deberia participar de las validaciones… asi que por ese lado no tendrias inconveniente calculo.

Saludos

Hola, pudiste hacer algo con eso?

slds.

Hola, Yo lo resolví de la siguiente manera. Dentro de la pantalla utilice un componente ef_fijo(mapa) que permita html luego en el código del ci usé la siguiente lógica en el conf:

function conf__componente(ei_formulario $form)
{

	$buscador = $this->get_relacion()->tabla('domicilio')->nueva_busqueda();
			
	if($this->get_relacion()->tabla('domicilio')->get_cantidad_filas() > 0){
	//Seteo variables de Calle, Numero y Localidad para usarlas en el mapa
	$calle = $buscador->buscar_filas()[0]['calle'];
	$numero = $buscador->buscar_filas()[0]['numero'];
	$idlocalidad = $buscador->buscar_filas()[0]['idlocalidad'];
	$sql = "SELECT
			localidad.descripcion
			FROM
			localidad
			WHERE
			localidad.idlocalidad = ".quote($idlocalidad);
	$localidad = toba::db()->consultar_fila($sql)['descripcion'];
	
	//Seteo el iframe para embeber un mapa de google maps
	//***** Código para mostrar mapa con vista de calles	
	$this->dep('mapa')->ef('mapa')->set_estado("<iframe
		width='600'
		height='300'
		frameborder='0' style='border:0'
		src='https://www.google.com/maps/embed/v1/place?key=CLAVE AUT GOOGLE
		&q=".utf8_decode($calle)."+".$numero."+".utf8_decode($localidad)."+Argentina' allowfullscreen>
		</iframe>");
}

Espero se entienda algo. La clave de autenticación de google y algunos ejemplos poder verlo en https://developers.google.com/maps/web/?hl=ES.

Saludos.

Hola buenos dias, comparto la implementacion que realice de google maps y formulario ML, por si alguien le sirve. adjunto imagen asi se visualiza como quedaria.

<?php
class ei_pantalla_fincas extends toba_ei_pantalla {

    protected function generar_layout() {
    
        $dep = $this->get_dependencias();
        echo "<table border=\"0\">
                <tbody>
                    <tr>
                        <td>";
                        $dep['form']->generar_html();
        echo "        </td>
                        <td rowspan=\"2\" height=\"300px\" width=\"100%\">
                            <div id=\"map\" style=\"position: relative; height: 350px; width: 750px;\">
                                </div>
                        </td>
                    </tr>
                    <tr>
                    <td>";
                        $dep['form_coordenadas_ml']->generar_html();
        echo "      </td>
                    </tr>
                </tbody>
            </table>";
            echo "<script src=\"https://maps.googleapis.com/maps/api/js?key=AIzaSyDk5VmMH2dDxDUlbmdXY2ZFD_YjfK9N_O0&signed_in=true&libraries=drawing&callback=initMap\"
            async defer></script>";
    }
    
    function extender_objeto_js() {
        echo "
            function initMap() {
                var latitud = -29.4313638;
                var longitud = -66.869118;
                var map = new google.maps.Map(document.getElementById('map'), {
                    center: {lat: latitud, lng: longitud},
                    zoom: 15,
                });

                var drawingManager = new google.maps.drawing.DrawingManager({
                    drawingMode: google.maps.drawing.OverlayType.POLYGON,
                        drawingControl: true,

                    drawingControlOptions: {
                                editable: false,
                        position: google.maps.ControlPosition.TOP_CENTER,
                        drawingModes: [
                            google.maps.drawing.OverlayType.POLYGON,  
                        ]
                    }
                    
                });
                drawingManager.setMap(map);

                google.maps.event.addListener(drawingManager, 'polygoncomplete', function (polygon) {
                    var coordinates = (polygon.getPath().getArray());

                    for (var i = 0; i < coordinates.length; i++) {
                            var fila = {$this->objeto_js}.dep('form_coordenadas_ml').crear_fila();                          
                            {$this->objeto_js}.dep('form_coordenadas_ml').ef('lat').ir_a_fila(fila).set_estado(coordinates[i].lat());
                            {$this->objeto_js}.dep('form_coordenadas_ml').ef('long').ir_a_fila(fila).set_estado(coordinates[i].lng());
                    }
                    drawingManager.setMap(null);
                });               
            }
            
        {$this->objeto_js}.dep('form_coordenadas_ml').crear_fila_o = {$this->objeto_js}.dep('form_coordenadas_ml').crear_fila;
            /*redefinimos el metodo de crear fila del ml*/
        {$this->objeto_js}.dep('form_coordenadas_ml').crear_fila = function() {
            //Invoca a la creacion original
            var nueva_fila =  {$this->objeto_js}.dep('form_coordenadas_ml').crear_fila_o();
            //devolvemos la fila actual
            return nueva_fila;
        };            

        ";
    }
}
?>

2016-11-30 11_45_39-Giga_pasas - Fincas.png

2016-11-30 11_45_39-Giga_pasas - Fincas.png

MUY BUENO, GRACIAS POR COMPARTIR …

Hola Leo,

muy buen trabajo y gracias por compartirlo :).

Saludos