Javascript: Как сопоставить координаты gps с изображением

Question

Я новичок в программировании и JavaScript. Я работаю над приложением для Android-планшета, который может открывать файл изображения одним щелчком мыши. Теперь у меня есть изображение, которое показывает карту моего соседства. Я хочу, чтобы мое местоположение GPS отображалось на этом изображении с беспроводным сетевым подключением и без него. Как мне это сделать? Я использую структуру Jo, потому что другой парень, который работал над этим приложением, использовал его, хотя я не уверен, почему.

Этот код дает мне ошибку как «ReferenceError: зр не определен» // Показывает список доступных карт

var MapsCard = { 
cardName: "mapsCard", 



init: function() { 
    "use strict"; 
    /*jslint newcap: true */ 
    joCache.set(this.cardName, function() { 
     this.card = new joCard(new joFlexcol([ 
     this.title = new joTitle("Maps"), 
     //fancy toggle button 
     new joLabel("GPS"), 
     new joToggle(("isActive")), 
     //Select maps dropdown 
     this.dropdownlist = new joSelect([ "map1", "map2"]), 
     ])); 
     // respond to the change event 
     this.dropdownlist.selectEvent.subscribe(this.openmaps, this); 
     return this.card; 
    }.bind(this)); 
}, 

openmaps: function(value) { 
    console.log(value); 
    console.log("Loading picture ........" + value); 
    //For different value load different maps. 
    if(value == 0) { 
     var win1 = window.open(''); 
     var img1 = win1.document.createElement("img"); 
     img1.src = "image1.png"; 
     win1.document.body.appendChild(img1); 
        if (navigator.geolocation) { 
         navigator.geolocation.getCurrentPosition(sp); 
         console.log("navigator.geolocation Works"); 
     } else { 
      console.log("Geolocation is not supported"); 
       } 
      } 
    if(value == 1) { 
     var win2 = window.open(''); 
     var img2 = win2.document.createElement("img"); 
     img2.src = "image2.png"; 
     win2.document.body.appendChild(img2); 

    } 
}, 

    sp: function(position) { 
      //console.log(position.coords.latitude); 
      //console.log(position.coords.longitude); 
      console.log("Works...."); 
    },  

activate: function() { 
    "use strict"; 
    this.active = true; 
    }, 

deactivate: function() { 
     "use strict"; 
      this.active = false; 
    }, 

};

Answer 1

Вот краткий учебник, чтобы получить позицию GPS: HTML5 Geolocation

Вы в основном сделать вызов, как это:

<script> 
var x = document.getElementById("demo"); 
function getLocation() { 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition); 
    } else { 
     x.innerHTML = "Geolocation is not supported by this browser."; 
    } 
} 
function showPosition(position) { 
    x.innerHTML = "Latitude: " + position.coords.latitude + 
"<br>Longitude: " + position.coords.longitude; 
} 
</script> 

Чтобы поставить широта/долгота точки на верхней части изображения, вы» должен знать лат/лон каждого угла изображения, а затем выполнить некоторую математику. Если вы не используете некоторые геопространственные рамки, такие как API Карт Google или OpenLayers, в этом случае математика может быть выполнена для вас.