Usando a API do Google Maps como referência, fiz um html simples e funcional onde o usuário pode digitar dois endereços e traçar um ponto-a-ponto (muito semelhante ao que o Apontador disponibilizava e que lhe gerou muita fama) entre os mesmos.
O html é bem simples, contêm duas divs que receberão o mapa e as informações do ponto-a-ponto, e um formulário com os campos
<div id="map"></div>
<form action="#" method="POST">
<fieldset>
<label for="from">ponto de partida:</label>
<input type="text" name="from" id="from" />
</fieldset>
<fieldset>
<label for="from">ponto final:</label>
<input type="text" name="to" id="to" />
</fieldset>
<input type="button" class="button" id="trace-route" value="traçar rota" />
</form>
<div id="route"></div>
O javascript, comentado, é o seguinte:
<script src="http://maps.google.com/maps?file=api&v=2" type="text/javascript"></script>
<script type="text/javascript">
//cria variáveis globais a serem usadas
var map;
var directionsPanel;
var directions;
//cria mapa quando página carregar
window.onload = function() {
//define que o mapa será desenhado dentro do elemento ´map´
map = new GMap2(document.getElementById("map"), { size: new GSize(710,480) })
//insere o controle que possibilita usuário aumentar/diminuir zoom
map.addControl(new GLargeMapControl());
//usando as coordenadas de latitude e longitude para São Paulo/SP
map.setCenter(new GLatLng(-23.547779, -46.639366), 12);
//define que o ponto-a-ponto será mostrado dentro do elemento ´route´
directionsPanel = document.getElementById("route");
directions = new GDirections(map, directionsPanel);
//efetua a busca, quando usuário clicar no botão
document.getElementById("trace-route").onclick = function() {
var fromAddress = document.getElementById("from").value;
var toAddress = document.getElementById("to").value;
/*
"locale":"pt_BR" é necessário ser colocado para forçar uma busca usando os maapas brasileiros
se não for definido, será usado o padrão da conta do usuário que está usando o browser, o que
pode provocar erros na busca
*/
directions.load(fromAddress + " to " + toAddress, {"locale":"pt_BR"});
}
}
</script>
Observação: na primeira linha, há a chamada o javascript da API do Google Maps. Se você só for testar em um html na sua máquina, funcionará corretamente. Quando for colocar em produção, ou seja, passando por webserver, você terá que gerar uma chave pública do Google. Troque essa chamada pela chamad que será fornecida a você.
Se quiser, faça o download do html já pronto.
E não se esqueça de ver os exemplos do Google Maps, para que você possa ter mais idéias 😉