Jump to content
Rodrigo Razzyel

converter km para R$ com o resultado do Google maps

Recommended Posts

Ola preciso de ajuda, ja tentei de varias formas mas não consegui, estou tendo dificuldade em converter km para R$ .
eu preciso que o resultado do google maps em km seja multiplicado por R$ 1,50 . assim o usuario teria o valor por km.. veja o codigo abaixo...

===============================================================================================

 

<!DOCTYPE html>
<head>
<title>Calcular distancia entre cidades (mapas e rotas)</title>
<script src="http://code.jquery.com/jquery-1.8.1.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
function CalculaDistancia() {
$('#litResultado').html('Aguarde...');
//Instanciar o DistanceMatrixService
var service = new google.maps.DistanceMatrixService();
//executar o DistanceMatrixService
service.getDistanceMatrix(
{
//Origem
origins: [$("#txtOrigem").val()],
//Destino
destinations: [$("#txtDestino").val()],
//Modo (DRIVING | WALKING | BICYCLING)
travelMode: google.maps.TravelMode.DRIVING,
//Sistema de medida (METRIC | IMPERIAL)
unitSystem: google.maps.UnitSystem.METRIC
//Vai chamar o callback
}, callback);
}
//Tratar o retorno do DistanceMatrixService
function callback(response, status) {
//Verificar o Status
if (status != google.maps.DistanceMatrixStatus.OK)
//Se o status não for "OK"
$('#litResultado').html(status);
else {
//Se o status for OK
//Endereço de origem = response.originAddresses
//Endereço de destino = response.destinationAddresses
//Distância = response.rows[0].elements[0].distance.text
//Duração = response.rows[0].elements[0].duration.text
$('#litResultado').html("<strong>Origem</strong>: " + response.originAddresses +
"<br /><strong>Destino:</strong> " + response.destinationAddresses +
"<br /><strong>Distância</strong>: " + response.rows[0].elements[0].distance.text +
" <br /><strong>Duração</strong>: " + response.rows[0].elements[0].duration.text
);
//Atualizar o mapa
$("#map").attr("src", "https://maps.google.com/maps?saddr=" + response.originAddresses + "&daddr=" + response.destinationAddresses + "&output=embed");
}
}
</script>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr>
<td>
<label for="txtOrigem"><strong>Endereço de origem</strong></label>
<input type="text" id="txtOrigem" class="field" style="width: 400px" />
</td>
</tr>
<tr>
<td>
<label for="txtDestino"><strong>Endereço de destino</strong></label>
<input type="text" style="width: 400px" class="field" id="txtDestino" />
</td>
</tr>
<tr>
<td>
<input type="button" value="Calcular distância" onclick="CalculaDistancia()" class="btnNew" />
</td>
</tr>
</tbody>
</table>
<div><span id="litResultado"> </span></div>
<div style="padding: 10px 0 0; clear: both"></div>
</body>
</html>

Share this post


Link to post
Share on other sites

Apenas o excerto relevante:

 $('#litResultado').html("<strong>Origem</strong>: " + response.originAddresses +
      "<br /><strong>Destino:</strong> " + response.destinationAddresses +
      "<br /><strong>Distância</strong>: " + response.rows[0].elements[0].distance.text +
      " <br /><strong>Duração</strong>: " + response.rows[0].elements[0].duration.text +
      " <br /><strong>Preço</strong>: R$ " + (parseFloat(response.rows[0].elements[0].distance.text.substring(0, response.rows[0].elements[0].distance.text.length - 3).split(",").join(".")) * 1.5).toFixed(2).toString().split(".").join(",")
); 

Exemplo.

 

Explicando a expressão (se necessário):

  1. Extrair o valor da distância ("descartando" unidade de medida)
  2. Trocar a vírgula (separador decimal) por um ponto de modo a poder calcular o preço.
  3. Voltar a formatar o preço de forma adequada para mostrar ao utilizador.
  • +1 1

Share this post


Link to post
Share on other sites

Ola amigo funcionou perfeitamente . surgiu um problema que ponho para pesquisar

DESTINO: Rua Alvaro de Carvalho - Anhagabau- SP

ORIGEM: Av. Teodoro Sampaio - SP

AGUARDE........

Fica aguardando e não da o resultado. mas quando pesquiso por estado funciona.

eu acho que me atrapalhei com alguma coisa.

Share this post


Link to post
Share on other sites

@hgkiller, que parte do cálculo é que não está correcto?

 

Se reparares, utilizei um multiplicador de 1.5 no exemplo. Terás que alterar esse valor para o que pretendes.

 

Para te podermos ajudar melhor, mostra o código que tens de momento.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By larissamilher
      Boa tarde, estou fazendo um site para uma cliente, ele tem interação com a api Google Maps plataform, quando o usuário está logado na sua conta do google fica aparecendo a foto dele no maps, a minha cliente gostaria que desativasse isso, eu expliquei que só a pessoa consegui vê e tudo, mas por ser um site restrito ela gostaria disso desativado. Gostaria de saber se tem como desativar isso por meio de código no wordpress. Segue abaixo a foto do mapa com a foto de perfil. Obrigada desde já.    Codigo do functions.php   add_shortcode('mapa', 'iframe_maps_api'); function iframe_maps_api($atts) {     $pais = $estado = $cidade = $bairro = $numero = '';     $pais   = str_replace( "-", "+", sanitize_title($atts['pais']) );     $estado = str_replace( "-", "+", sanitize_title($atts['estado']) );     $cidade = str_replace( "-", "+", sanitize_title($atts['cidade']) );     $bairro = str_replace( "-", "+", sanitize_title($atts['bairro']) );     $numero = str_replace( "-", "+", sanitize_title($atts['numero']) );     return '  <iframe id="maps_api"                                 src="https://www.google.com/maps/embed/v1/place?key='.$atts['key'].'&q='.$pais.','.$estado.','.$cidade.','.$bairro.','.$numero.'"                  allowfullscreen>            </iframe>';      } codigo da pagina que tem o maps <?php $cidade = get_dados_cadastro_anunciante('cidade');     $estado = get_dados_cadastro_anunciante('estado');     $bairro = get_dados_cadastro_anunciante('bairro');     if ( ! empty($cidade) && ! empty($estado) ) {         echo '<div class="box-mapa-iframe">';         echo do_shortcode('[mapa key="AIzaSyBBxZc2NLpikD63PndZ-LtHum2iYhkr1yw" pais="Brasil" estado="'.$estado.'" cidade="'.$cidade.'" bairro="'.$bairro.'"]');         echo '</div>';         echo '<div class="rota_como_chegar">                 <a href="https://www.google.com.br/maps/dir//Brasil,'.$cidade.','.$estado.','.$bairro.'/" target="_blank">Como Chegar <i class="fas fa-map-marker-alt"></i></a>             </div>'; ?>  
       
       
    • By Alan Quidornne
      Olá Amigos,
       
      Tenho enfrentado uma séria dificuldade ao utilizar o serviço "Autocomplete" do Google Maps API.
       
      Estou desenvolvendo um sistema de reserva de transfers(viagens de carro executivo) na qual o usuário informa a origem e destino de sua viagem e o sistema integrado com o Google Maps calcula o preço da viagem em questão .
       
      A dificuldade que estou tendo é limitar a exibição dos resultados do Autocomplete para locais restritos ao estado do Rio de Janeiro.
       
      Consigo tranquilamente limitar por país, mas para o território do Rio de Janeiro não consegui achar nenhuma função na documentação oficial que me atendesse nessa questão.
       
      Segue código do autocomplete.
      function initialize() { var options = { componentRestrictions: { country : "BR" } }; directionsService = new google.maps.DirectionsService(); var inputFrom = document.getElementById('from'); var autocompleteFrom = new google.maps.places.Autocomplete(inputFrom, options); autocompleteFrom.addListener('place_changed', function() { var place = autocompleteFrom.getPlace(); placeId1 = place.place_id; }); var inputTo = document.getElementById('to'); var autocompleteTo = new google.maps.places.Autocomplete(inputTo, options); autocompleteTo.addListener('place_changed', function() { var place = autocompleteTo.getPlace(); placeId2 = place.place_id; }); } Se alguém souber e puder fazer a gentileza de me auxiliar nessa questão, ficarei bastante agradecido.
    • By Rogério Nascimento
      Primeira mente eu gostaria de pedir desculpa se eventualmente eu  estiver postando na área errada sou novo aqui e pegarei o jeito logo logo.
       
      estou desenvolvendo uma aplicação web que possibilita o cadastro do cliente bem como seu endereço e estou em busca de uma solução para na pagina que mostra os dados do cliente selecionado abrir um mapa com a localização de seu endereço a partir dos dados de endereço que tenho registrado no bando de dados.
       
      alguém poderia me indicar uma solução pra eu estudar e implementar?
    • By JM Ruas
      Boa tarde,
       
      Não consigo encontrar resposta à seguinte pergunta:
      - pretendo, ao abrir a página que contém um mapa Google, que ele posicione o marcador no local onde me encontro. Qual API devo escolher para que isso possa acontecer?
      Será Google Maps Directions, Maps Geocoding, Maps Javascript, Maps API Web Services ou outra?
      Obrigado pela ajuda.
      JMRuas
    • By matheusmarson
      Galera, boa tarde
       
      Alguém sabe qual a app que se usa para inserir os "lugares", "estabelecimentos", etc... nos maps do goggle que será inserido em um site?
      Igual a este aqui: http://preview.ait-themes.club/theme/directory2/
       
      Como é que este dados são inseridos? Endereço? Coordenadas de geolocalização?
       
      Alguém teria uma idéia?
       
      Obrigado
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.