2016-08-31 4 views
0

tl; dr: Как преобразовать путь полигона SVG в координаты gps или идентичный google.maps.Polygon?Преобразование пути многоугольника SVG в широтные и длинные координаты

Целью моего высокого уровня является определение того, находится ли 20 000 отдельных GPS-координат в пределах фиксированной области (геозонность). У меня уже сохранены координаты gps, и у меня есть базовое представление о том, как я буду тестировать, находятся ли они в этом районе.

Где я сейчас пытаюсь преобразовать путь в GPS lat/long, который, я уверен, является просто формулой, и мне нужно будет согласовать 0,0 и масштаб - этот ответ был многообещающий: https://stackoverflow.com/a/24171749/550595, который я использовал для «преобразования», но результат даже не близок.

У меня есть путь SVG многоугольник, который я позаимствовал из другой карты (не Google Maps, но это достаточно близко), и я вынес его на карте: https://jsfiddle.net/2n2jmj8L/1/

var width = 624, // width of SVG 
    height = 746; // height of SVG 

function toLongitude(x) { 
    return x * 180/width; 
} 

function toLatitude(y) { 
    return -y * 180/width + 90; 
} 

function initMap() { 
    // The SVG path; 
    var path = document.getElementById("reservation-path").getAttribute("d"); 

    // Get the points. Even indices are x coordinates and odd indices are y 
    // coordinates. Note that these are strings. 
    var points = path.match(/(\d+)/g); 

    map = new google.maps.Map(document.getElementById('map'), { 
    streetViewControl: false, 
    //scrollwheel: false, 
    disableDefaultUI: true, 
    draggable: false, 
    zoom: 11, 
    center: { 
     lat: 41.3671863, 
     lng: -123.8799729 
    }, 
    mapTypeId: 'roadmap' 
    }); 

    // Map polygon coordinates 
    var polyCoordinates = []; 
    for (var i = 0; i < points.length; i += 2) { 
    var longitude = toLongitude(parseInt(points[i]) + 6),//I added the 6 and the following 5 to offset the parent transform 
     latitude = toLatitude(parseInt(points[i + 1]) + 5); 

    polyCoordinates.push(new google.maps.LatLng(latitude, longitude)); 
    } 

    console.log(polyCoordinates); 

    var polygon = new google.maps.Polygon({ 
    paths: polyCoordinates, 
    strokeColor: '#FF0000', 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: '#FF0000', 
    fillOpacity: 0.35 
    }); 

    polygon.setMap(map); 

    // Add a listener for the click event. 
    polygon.addListener('click', showArrays); 

    infoWindow = new google.maps.InfoWindow; 
} 

На стороне записки ... Карты Google/Места очертают область, которую я хочу использовать в качестве моего геообъекта: https://www.google.com/maps/place/Yurok+Reservation,+Trinity-Klamath,+CA/@41.373847,-123.9471508,11z/data=!4m5!3m4!1s0x54d1a8156f591fd5:0xbcbca4e17d7d8801!8m2!3d41.3724029!4d-123.9009415, но я не смог ничего сделать с этим, кроме как использовать его в качестве ссылки.

Я уже потратил слишком много времени на это, поэтому, даже если мне нужно отказаться от того, что у меня есть, я сделаю это. Все, что я хочу сделать, это иметь возможность прокручивать набор координат и возвращаться, если они находятся на пути в моем JSFiddle.

Заранее спасибо ...

ответ

1

Эта страница отображается документ, как преобразовать пиксель экрана координат широты/долготы координат.

https://developers.google.com/maps/documentation/javascript/examples/map-coordinates

+0

Я желаю я получил этот ответ на несколько часов раньше, как я думаю, что вы к чему-то; формулы для функции 'project'' return new google.maps.Point' могли быть изменены для моих нужд. Вместо этого я был нетерпелив и грубо прорисовал схему с помощью многоугольника, используя инструменты google.maps.drawing, а затем вернул координаты в консоли. Я смог наложить исходный путь SVG сверху и по-прежнему рисовать на карте, установив правило 'pointer-events: none;' CSS на элементе SVG. Не идеально, но это сработало. Я буду отмечать это как ответ, потому что он ближе к тому, что я изначально хотел. Благодарю. – jreed121

Смежные вопросы