Como iniciar com Google Maps JavaScript API v3

welkercosta · Mensagem por **welkercosta** » 23 Set 2010, 21:46

Olá pessoal do MapaRadar, meu nome é Welker ( Tá no meu nick

) eu sou webdesign amador e sócio do Sinal3G.com.br, que assim como o MapaRadar, é um mapa colaborativo, só que sobre as áreas com recepção 3G do Brasil.

O Sinal3G recebe um intenso feedback de diverssos sites e blogs de tecnologia em todo Brasil, veja algumas materias abaixo:

[Tecnoblog] Brasileiro cria mapa colaborativo do sinal 3G
[Gizmodo]O mapa da cobertura 3G no Brasil (Em construção)
[Macmagazine]Projeto “Mapa com Sinal 3G no Brasil” cresce bastante, mas ainda necessita de colaborações
[Superdownloads]Sinal 3G
[iMasters]Brasil tem próprio mapa de internet 3G
[FayerWayer]Aplicações web brasileiras para ficar de olho em 2010 [FW Top 5]
[GEEK]Brasil tem próprio mapa de internet 3g
[brogui]Onde tem e não tem sinal 3G no Brasil?

Quando eu fiz o primeiro layout do site em troca de alguns trocados do Gabriel Subtil - dono do blog de tecnologia Tambotraising e idealizador do projeto - usei um iframe com o mapa, nada "sexy" para a web atual.

Eu não usei a API do Google, pois não sei como criar um mapa colaborativo usando os dados atuais do mapa ( Muita coisa por sinal ).

Atualmente o mapa pode ser marcado pelo endereço disponibilizado no link "Colabore" do menu, o que é pouco seguro, já que qualquer sujeito de má fé chega toda hora pra zuar e editar o mapa.

O que eu queria mesmo, é que os usuários que desejassem colaborar tivessem que logar para editar as marcações.

Alguém pode me dar uma luz sobre o Google API para Mapas??

P.S: Pretendo usar a API V3 ( Aquele que não precisa de chave para ser usado )

welkercosta · Mensagem por **welkercosta** » 24 Set 2010, 15:06

Conseguir!

Código: Selecionar todos

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Mapa com Sinal 3G no Brasil</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><!--Carrega a API-->
<script type="text/javascript">
function initialize(){ // Função que vai carregar o mapa
var latlng=new google.maps.LatLng(-14.264383,-55.898437); //Coordenadas iniciais
var myOptions={
zoom:5, // Define o nível de zoom
center:latlng, // centraliza o mapa nas coordenadas "latlng"
mapTypeId:google.maps.MapTypeId.ROADMAP, // Tipo de mapa
navigationControlOptions:{style:google.maps.NavigationControlStyle.ZOOM_PAN}, // Estilo dos controles de navegação
mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU} // Estilo do menu para selecionar o tipo de mapa
};
var map=new google.maps.Map(document.getElementById("map_canvas"),myOptions); // Cria o mapa, que sera visualizado na div id "map_canvas"
var ctaLayer=new google.maps.KmlLayer('http://www.google.com/maps/ms?ie=UTF8&msa=0&output=nl&msid=113976276902643639906.00046b32d8f3dec0276ba');
ctaLayer.setMap(map); // Carrega o endereço do KML do Google Mapas com todas as contribuições dos usuários do Sinal3G
}
</script>
</head>
<body onLoad="initialize()"> <!-- Inicia o função depois que a pagina é carregada -->
<div id="map_canvas" style="width:100%; height:100%"></div> <!-- O mapa aparece dentro dessa DIV -->
</body>
</html>

Mais informações aqui: code.google.com/intl/pt-BR/apis/maps/

Como iniciar com Google Maps JavaScript API v3

Como iniciar com Google Maps JavaScript API v3

Re: Como iniciar no Google API?