segunda-feira, 27 de junho de 2011

Chocolate e Jurupiga

O chocolate é a bebida sagrada do Novo Mundo, enquanto a Jurupiga é o vinho vira-latas da Europa. São opostos que combinam muito bem. O álcool traz o otimismo para a criação e o amargo do chocolate ajuda na concetração. A combinação é divina. Com a ajuda deles, escrevi um pouco de Javascript para juntar dois mapas antípodas do Google Maps numa só tela. Quando se muda a posição ou a ampliação do mapa da esquerda, o da direita ajusta-se automaticamente para que seu centro seja o antípoda do centro do outro.


Infelizmente, o antípoda do Rio Grande do Sul está no meio do mar entre o Japão e a China. Por outro lado, esta deve ser a única região da Ásia tão despovoada quanto o Pampa.


<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  div { float: left }
</style>
<script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
  function init() {
    var lat=-29.683889;
    var lng=-53.806944;

    var here = new google.maps.Map(document.getElementById("here"),  { 
      zoom: 8, 
      center: new google.maps.LatLng(lat, lng),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var there = new google.maps.Map(document.getElementById("there"), { 
      zoom: 8, 
      center: new google.maps.LatLng(-lat, 180-Math.abs(lng)),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    
    google.maps.event.addListener(here, 'zoom_changed', function() {
      there.setZoom(here.getZoom());
    });
    
    google.maps.event.addListener(here, 'center_changed', function() {
      var point=here.getCenter();
      var sign=point.lng()<0?1:-1;
      there.setCenter(new google.maps.LatLng(-point.lat(), 
        sign*(180-(Math.abs(point.lng())))));
    });
  }

</script>
</head>
<body onload="init()">
  <div id="here" style="width:400px; height:400px"></div>
  <div id="there" style="width:400px; height:400px"></div>
</body>
</html>

O código foi testado no Chrome, no Firefox e no IE. Em todos funciona, mas é no Chrome que ele roda mais rápido.
Enjambrado por forinti às 14:09
Marcadores:

3 comentários:

  1. Flávio30 de junho de 2011 às 04:40

    Da Wikipedia: Sobre a Terra, apenas 4% da superfície possui pontos antipodais situados ambos em terras emersas. Em 46% dos casos, ambos os pontos antipodais são situados nos oceanos, e os restantes 50% são mistos.

    É difícil, tem muita água na Terra!

    ResponderExcluir
  2. Ed.Londero7 de julho de 2011 às 10:02

    Fantástico.
    Estava procurando isso e não entendia como eles tinham trocado as APIs javas por javascripts.
    Burraldo, não me toquei que o javascript funciona em um arquivo solto.
    Sabes como consultar mais APIs dessas bibliotecas ?

    ResponderExcluir
  3. forinti7 de julho de 2011 às 12:24

    A documentação está toda aqui: http://code.google.com/apis/maps/documentation/javascript/reference.html

    E, mais uma vez, obrigado pela Jurupiga!

    ResponderExcluir

Assinar: Postar comentários (Atom)