Estou com problemas ao utilizar a API do Google Maps V3 (usando o Codeigniter). A view que recebe o mapa não possui formatação nenhuma a não ser aquela já fornecida pela API. Desta forma, criei um iframe que carrega essa view dentro da página onde pretendo usá-la e um form recebendo o local onde o usuário está, para que assim seja feito o mapa até o local do estabelecimento que está fixo. O problema é que preciso passo por é que não sei como atualizar o iframe e com ele criar o mapa de destino. Seguem abaixo os códigos:
Controller:
class Localizacao extends CI_Controller
{
public $estilo = 'css/responsivo/estilo.css';
public $header = 'css/header.css';
public $principal = 'css/principal.css';
function __construct()
{
parent::__construct();
//Carregamento dos helpers na página
$this->load->helper(array('form', 'html', 'url'));
$this->load->library(array('googlemaps','input'));
}
function index()
{
//Carrgando dados a view
$dados = array(
'titulo' => 'Titulo',
'estilo' => $this->estilo,
'header' => $this->header,
'principal' => $this->principal,
'formulario' => array(
'id' => 'traca-rota',
'class' => 'form-rota',
),
);
$this->load->view('localizacao_view', $dados);
}
function mapa($local = NULL)
{
if($local == NULL)
$localizacao = 'Endereço de Destino';
else
$localizacao = preg_replace("-", " ", $local);
$config['center'] = 'Endereço de destino';
$config['zoom'] = 'auto';
$config['directions'] = TRUE;
$config['directionsStart'] = $localizacao;
$config['directionsEnd'] = 'Endereço de Destino';
$config['directionsDivID'] = 'directionsDiv';
$this->googlemaps->initialize($config);
$data['map'] = $this->googlemaps->create_map();
$this->load->view('mapa_view', $data);
}
}
View locazizacao_view:
<?php include 'includes/header.php'; ?>
<?php echo form_open('#', $formulario); ?>
<input type="text" name="localizacao">
<input type="submit" value="Traçar Rota" id="traca_rota">
<?php form_close(); ?>
<div id="fora">
<iframe src="<?php echo base_url('/localizacao/mapa/'); ?> " frameborder="0"></iframe>
</div>
View mapa_view:
<!DOCTYPE html>
<html>
<head>
<?php echo $map['js']; ?>
</head>
<body>
<?php echo $map['html']; ?>
<div id="directionsDiv"></div>
</body>
</html>
Método que manda parâmetro para a view 'mapa_view':
$('#traca-rota').submit(function(){
var dados = $( this ).serialize();
var action = "http://urldosite.com/localizacao/mapa";
$.ajax({
type: "POST",
url: action,
data: dados,
success: function( data )
{
//Evitar refresh em página
return false;
}
});
return false; //Faz com que o Formulário Não envie seus dados da Maneira Tradicional
});
Caso alguém souber alguma outra forma de fazer a integração contendo as informações de Saída/Destino ou se alguém souber a solução desse problema, ficarei muito agradecido.