Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

kdz

Capturar dados, rodar for, atualizar array

Por , em Javascript

Recommended Posts

kdz    0

kdz
Postado

Opa, seguinte.

 

Tenho a seguinte tabela

- id

- nome

- cnpj

- endereco

- lat

- log

 

Quero capturar todos os dados dessa tabela de alguma forma e criar um array com eles, mais ou menos assim.

 

- id

-- nome

-- cpnj

-- endereco

-- lat

-- log

-- km (vazio será atualizado depois)

 

function calcular(id){
     //captura o id do array, faz oque for necessário e depois atualiza o array com a informação de km
}

for( i=0 ; i<qtdarray ; i++){
      calcular(id); // id do array
}

A minha dúvida é como capturar todos esses dados e joga-los nesse for e também como atualizar o array.

 

Se alguém puder ajudar, obrigado desde já.

abs.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

poste o HTML desta tabela.

Compartilhar este post

Link para o post
Compartilhar em outros sites

kdz    0

kdz
Postado

Como assim o html da tabela? =p

 

A tabela é no banco de dados.

Eu posso disponibilizar ela numa página php, mas precisaria de um padrão para que o js, possa capturar certo?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

hum.. talvez...

 

uma forma mais simples para o js ler, seria o formato json

mas se você não informar oque está querendo fazer, qual o motivo, fica difícil ajudar. ^_^

Compartilhar este post

Link para o post
Compartilhar em outros sites

kdz    0

kdz
Postado

É que eu tentei resumir.

Estou pegando o endereço do usuário e quero calcular a distância entre alguns endereços previamente cadastrados em um banco de dados.

A parte de capturar o endereço do usuário e calcular a proximidade (a qual me retorna uma quantidade em metros da distância) já estão feitas.

O que eu quero fazer agora é pegar os endereços do banco, criar um array com eles, rodar aquela função e atualizar o array com a distância do endereço.

O array é necessário pois vou utilizar em outra função nesse mesmo script, para criar alguns marcadores no mapa.

 

Espero que tenha ficado claro e possa me ajudar.

abs

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

então jSON mesmo.

 

http://php.net/json

Compartilhar este post

Link para o post
Compartilhar em outros sites

kdz    0

kdz
Postado

Não sabia dessa função, legal ela já deixa tudo no esquema.

 

<?php

$var['postos'][0]['nome'] = 'Local 1';

$var['postos'][0]['log'] = '123';

$var['postos'][0]['lat'] = '123';

$var['postos'][1]['nome'] = 'Local 2';

$var['postos'][1]['log'] = '123';

$var['postos'][1]['lat'] = '123';

 

echo json_encode($var);

?>

 

Retorno

{"postos":[{"nome":"Local XYZ","log":"123","lat":"123"},{"nome":"Local XYZ","log":"123","lat":"123"}]}

Mas agora no js, como eu capturo esses dados e crio o array e depois o atualizo?

 

[]s

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

o array já tá ai amigo.

 

procura um parser de jSON, e procura entender como o javascript trata um objeto json.

por exemplo:

<script type="text/javascript">
var json = eval( {"postos":[{"nome":"Local XYZ","log":"123","lat":"123"},{"nome":"Local XYZ","log":"123","lat":"123"}]} );

alert( json.postos[0].nome );//Local XYZ
</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites

kdz    0

kdz
Postado

William muito obrigado por estar ajudando, já fiz quase tudo com sua ajuda.

 

A única coisa que falta agora é calcular qual o menor caminho para chegar no endereço.

Vou postar aqui o código completo para facilitar o entendimento, talvez até seja útil para alguém que esteja trabalhando com Google Maps.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
            var postos = eval([{"0":"1","id":"1","1":"Olaria","nome":"Olaria","2":"-22.836076","lat":"-22.836076","3":"-43.265405","log":"-43.265405","4":"2147483647","cnpj":"2147483647"},{"0":"2","id":"2","1":"Taquara","nome":"Taquara","2":"-22.918057","lat":"-22.918057","3":"-43.382449","log":"-43.382449","4":"2147483647","cnpj":"2147483647"},{"0":"3","id":"3","1":"Bras de Pina","nome":"Bras de Pina","2":"-22.832487","lat":"-22.832487","3":"-43.299444","log":"-43.299444","4":"2147483647","cnpj":"2147483647"}]);

            var userLocal;
            var directionDisplay;
            var directionsService = new google.maps.DirectionsService();
            var geocoder;
            var map;
            function initialize() {
                geocoder = new google.maps.Geocoder();
                directionsDisplay = new google.maps.DirectionsRenderer();
                var latlng = new google.maps.LatLng(-22.912674, -43.417397);
                var myOptions = {
                  zoom: 11,
                  center: latlng,
                  mapTypeId: google.maps.MapTypeId.ROADMAP
                }
                map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                directionsDisplay.setMap(map);

                adicionarMarcadores(map);
                capturarLocalizacao();
            }

            var endereco = 'Avenida das Américas, Barra da Tijuca - RJ';

            /*
             * adicionarMarcadores()
             *
             * adiciona marcadores no mapa
             */
            function adicionarMarcadores(map){
                for (var i = 0; i < postos.length; i++) {
                    var newest = postos[i];
                    var myLatLng = new google.maps.LatLng(newest['lat'], newest['log']);
                    var marker = new google.maps.Marker({
                        position: myLatLng,
                        map: map,
                        title: newest['nome']
                    });
                    inserirMsg(marker, i);
                  }
            }

            function inserirMsg(marker, number) {
              var message = '<strong>'+postos[number].nome+'</strong><br>CNPJ: '+postos[number].cnpj;
              var infowindow = new google.maps.InfoWindow({content: message});
              google.maps.event.addListener(marker, 'click', function() {
                infowindow.open(map,marker);
              });
            }

            /*
             * capturarLocalizacao()
             *
             * captura
             */
            function capturarLocalizacao(){
                if (geocoder) {
                  geocoder.geocode({ 'address': endereco}, function(results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                      userLocal = results[0].geometry.location;
                      for( i=0 ; i<postos.length ; i++){
                         calcularProximidade(postos[i].id, new google.maps.LatLng(postos[i].lat, postos[i].log));
                      }
                    } else {
                      alert("ERRO: Não foi possível localizar o endreço. " + status);
                    }
                  });
                }
            }

            /*
             * calcularProximidade()
             *
             * calcular proximidade entre os pontos com cada endereço do banco
             * traça a rota do que tiver o menor caminho
             */
            function calcularProximidade(id, endereco){
                var start = userLocal;
                var request = {
                    origin:start,
                    destination:endereco,
                    travelMode: google.maps.DirectionsTravelMode.DRIVING
                  };
                  directionsService.route(request, function(result, status) {
                    if (status == google.maps.DirectionsStatus.OK) {
                      var route = result.routes[0];

                      // nessa parte eu gostaria de calcular qual é o endereço que possui o menor caminho
                      // e executar o directionsDisplay.setDirections() nele

                      directionsDisplay.setDirections(result)
                    }else{
                        alert("ERRO: Não foi possível localizar o endreço. " + status);
                    }
                  });
            }
        </script>
    </head>
    <body onload="initialize()">
        <div id="map_canvas" style="width: 800px; height: 600px;"></div>
    </body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito