Ir para conteúdo

POWERED BY:

Arquivado

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

igorcacerez

Mapa

Recommended Posts

O mapa ele mostra ate 20 marcadores depois ele simplesmente desaparece, no banco tem mais de 150 registros quando coloco para mostrar todos ele some da tela.

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
	<script>
		var map;
		var infoWindow;

		var markersData = [
		
		<?php
		require("../config/conexao.php");

		$sql = mysql_query("SELECT * FROM Loja");
		while($query = mysql_fetch_array($sql)){

		    $Rua_Av = preg_replace( '/[`^~\'"]/', null, iconv( 'UTF-8', 'ASCII//TRANSLIT', $query['Rua_Av'] ) );
			$Nome = $query['NomeLoja'];
			$Tel = $query['Telefone'];
			$Site = $query['Site'];

			$rua = str_replace(' ',  '+', $Rua_Av);
			$numero = $query['Numero'];
			$cidade = str_replace(' ', '+', 'Sao Paulo');
			$pais = 'BR';

			$url = 'http://maps.google.com.br/maps/api/geocode/json?address=';
			$url .= "$numero+$rua,+$cidade,+$pais&sensor=false";

			$c = curl_init();
			curl_setopt($c, CURLOPT_URL, $url);
			curl_setopt($c, CURLOPT_RETURNTRANSFER, 1);
			$conteudo = curl_exec($c);
			curl_close($c);

			$json = json_decode($conteudo, false);
	
			$lat = $json->results[0]->geometry->location->lat;
			$lon = $json->results[0]->geometry->location->lng; 
			
			echo'
  		 	
			{
				lat: '.$lat.',
      			lng: '.$lon.',
      			nome: "Loja: '.$Nome.'",
      			morada1:"Telefone: '.$Tel.'",
      			morada2: "Site: '.$Site.'",
      			codPostal: "Rua: '.$Rua_Av.'" // não colocar virgula no último item de cada maracdor
   			},
			
			';
		}
	
	echo'
  		 {
				lat: -23.5343008,
      			lng: -46.617352,
      			nome: "Loja: Teste",
      			morada1:"Telefone: Teste",
      			morada2: "Site: Teste",
      			codPostal: "Rua: Teste" 
   		} // não colocar virgula no último item 
			
		';
  ?>
];

function initialize() {
   var mapOptions = {
      center: new google.maps.LatLng(-23.5393383,-46.6147891),
      zoom: 14,
      mapTypeId: 'roadmap',
   };

   map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

   // cria a nova Info Window com referência à variável infowindow
   // o conteúdo da Info Window será atribuído mais tarde
   infoWindow = new google.maps.InfoWindow();

   // evento que fecha a infoWindow com click no mapa
   google.maps.event.addListener(map, 'click', function() {
      infoWindow.close();
   });

   // Chamada para a função que vai percorrer a informação
   // contida na variável markersData e criar os marcadores a mostrar no mapa
   displayMarkers();
}
google.maps.event.addDomListener(window, 'load', initialize);

// Esta função vai percorrer a informação contida na variável markersData
// e cria os marcadores através da função createMarker
function displayMarkers(){

   // esta variável vai definir a área de mapa a abranger e o nível do zoom
   // de acordo com as posições dos marcadores
   var bounds = new google.maps.LatLngBounds();
   
   // Loop que vai estruturar a informação contida em markersData
   // para que a função createMarker possa criar os marcadores 
   for (var i = 0; i < markersData.length; i++){

      var latlng = new google.maps.LatLng(markersData[i].lat, markersData[i].lng);
      var nome = markersData[i].nome;
      var morada1 = markersData[i].morada1;
      var morada2 = markersData[i].morada2;
      var codPostal = markersData[i].codPostal;

      createMarker(latlng, nome, morada1, morada2, codPostal);

      // Os valores de latitude e longitude do marcador são adicionados à
      // variável bounds
      bounds.extend(latlng);  
   }

   // Depois de criados todos os marcadores
   // a API através da sua função fitBounds vai redefinir o nível do zoom
   // e consequentemente a área do mapa abrangida.
   map.fitBounds(bounds);
}

// Função que cria os marcadores e define o conteúdo de cada Info Window.
function createMarker(latlng, nome, morada1, morada2, codPostal){
   var marker = new google.maps.Marker({
      map: map,
      position: latlng,
      title: nome
   });

   // Evento que dá instrução à API para estar alerta ao click no marcador.
   // Define o conteúdo e abre a Info Window.
   google.maps.event.addListener(marker, 'click', function() {
      
      // Variável que define a estrutura do HTML a inserir na Info Window.
      var iwContent = '<div id="iw_container">' +
            '<div class="iw_title">' + nome + '</div>' +
         '<div class="iw_content">' + morada1 + '<br />' +
         morada2 + '<br />' +
         codPostal + '</div></div>';
      
      // O conteúdo da variável iwContent é inserido na Info Window.
      infoWindow.setContent(iwContent);

      // A Info Window é aberta.
      infoWindow.open(map, marker);
   });
}
	</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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