Quem precisa delimitar áreas (geofencing) a serem observadas por um sistema de automação baseado em GPS, como rotas, áreas proibidas, etc, freqüentemente precisa inserir no código matrizes de coordenadas. Por exemplo, digamos que você queira delimitar a circulação de uma pessoa ou veículo à região aproximada do bairro da Madalena, Em Recife (ou a qualquer lugar menos nessa região).
Você precisaria introduzir no seu código uma matriz de coordenadas semelhante a esta (o formato exato varia):
(-8.050816223141625, -34.91300582885742)
(-8.05922962720018, -34.913434982299805)
(-8.059654541958096, -34.90407943725586)
(-8.049626434722773, -34.90373611450195)
Existem algumas ferramentas que você pode usar para facilitar o trabalho de obter essas coordenadas.
Estas são online e usam o Google Maps.
- Polygon Creator Class (For Google Map API v3) – Provavelmente o mais fácil de usar. Clique em Reset, clique no mapa até formar um quadrado e depois clique em “Show Paths”. O autor disponibilizou o código completo para baixar no Github. Mudando as coordenadas em “var singapoerCenter” (no código HTML) você fará o mapa abrir na região desejada;
- Google Maps API v3 Tool – No topo escolha “Polygon” e “Javascript”. Na caixa ao lado de “Search”, coloque o nome da localidade onde você quer centralizar o mapa, por exemplo, “Madalena, Recife, Pernambuco” e clique em Search para posicionar o mapa. Clique em pelo menos três pontos sobre o mapa que já terá as coordenadas para o triângulo exibidas. Se clicar mais pontos o polígono correspondente será desenhado e as novas coordenadas serão exibidas. Clique em “Clear Map” para desenhar outro polígono.
- http://codepen.io/jhawes/pen/ujdgK – Para ver as coordenadas é preciso rolar a tela até ver a caixa de exibição e arrastar um dos pontos do triângulo. Essa é complicada de usar mas poderosa para quem entende algo de javascript. Você pode editar diretamente o código JS à direita da tela e ver as mudanças na hora. É possível mudar o formato com que as coordenadas são apresentadas, determinar coordenadas padrão, etc. Por exemplo, troque o código JS pelo abaixo para fazer o mapa abrir em Recife , demarcando uma área sobre os bairros das Graças e Madalena e com uma exibição mais “limpa” das coordenadas.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
//var myPolygon; function initialize() { var myLatLng = new google.maps.LatLng(-8.04359,-34.88159 ); var mapOptions = { zoom: 12, center: myLatLng, mapTypeId: google.maps.MapTypeId.RoadMap }; var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); var triangleCoords = [ new google.maps.LatLng(-8.04359,-34.88159), new google.maps.LatLng(-8.03203,-34.92142), new google.maps.LatLng(-8.07113,-34.9118) ]; myPolygon = new google.maps.Polygon({ paths: triangleCoords, draggable: true, editable: true, strokeColor: '#FF0000', strokeOpacity: 0.8, strokeWeight: 2, fillColor: '#FF0000', fillOpacity: 0.35 }); myPolygon.setMap(map); google.maps.event.addListener(myPolygon.getPath(), 'insert_at', getPolygonCoords); google.maps.event.addListener(myPolygon.getPath(), 'set_at', getPolygonCoords); } function getPolygonCoords() { var len = myPolygon.getPath().getLength(); var htmlStr = ''; for (var i = 0; i < len; i++) { if (window.CP.shouldStopExecution(1)) { break; } htmlStr += myPolygon.getPath().getAt(i).toUrlValue(5)+' '; } window.CP.exitedLoop(1); document.getElementById('info').innerHTML = htmlStr; } function copyToClipboard(text) { window.prompt('Copy to clipboard: Ctrl+C, Enter', text); } |
Você pode salvar sua própria cópia, com muito lixo junto mas funcional, clicando em “Change View” -> “Full Page” e então use o comando do seu browser para salvar a página completa no seu HDD. O arquivo a editar depois não é o que você salvou, mas um .htm dentro da pasta criada automaticamente.
Leave a Comment