2015-01-19 1 views
2

Этот вопрос связан с этим вопросом: Updating Leaflet Marker Position Every x Seconds with JSON. Только я хочу проецировать карту, созданную с помощью Leaflet, на 3D-глобус с помощью WebGLEarth. Как правило, вы можете комбинировать Leaflet и WebGLEarth, заменяя L.map, L.marker и т. Д. WE.map, WE.marker в вашем исходном коде Листа.Обновить позицию маркера json Листовка и WebGLEarth

Я хотел бы иметь текущее местоположение Международной космической станции проецируется на моем 3D глобус, поэтому я заменил L.marker в функции update_position этого кода ...

var cloudmadeUrl = 'http://{s}.mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.jpg'; 
      var subDomains = ['otile1','otile2','otile3','otile4']; 
      var cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 11,  subdomains: subDomains}); 

      var map = new L.Map('map', {layers : [cloudmade]}).fitWorld(); 

var iss; 

function update_position() { 
$.getJSON('http://open-notify-api.herokuapp.com/iss-now.json?callback=?', function(data) { 
    console.log(data); 
    var latitude = data["iss_position"]["latitude"]; 
    var longitude = data["iss_position"]["longitude"]; 
    if (!iss) { 
     iss = L.marker([latitude,longitude]).bindPopup("I am the ISS").addTo(map); 
     } 
    iss.setLatLng([latitude,longitude]).update(); 
    setTimeout(update_position, 1000); 
    }); 
    } 

update_position(); 

DEMO

... WE.маркером. К сожалению, обновление положения больше не работает на моем 3D-глобусе, тогда как оно работает на 2D-карте. Я попытался добавить

setInterval(update_position,2000); 

чуть выше update_position() ;, то маркер обновляется несколько раз (~ 5), а затем внезапно останавливается. Если я взаимодействую с мышью на земном шаре путем панорамирования, маркер обновляется до текущей позиции и обновляется несколько раз после этого и в конечном итоге останавливается снова.

Главный вопрос: Кто-нибудь знает, как исправить это, чтобы у меня было непрерывное обновление маркера?

Дополнительный вопрос: В идеале я хотел бы, чтобы трек Международной космической станции выглядел как https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=CZML.html&label=Showcases, с цветной дорожкой, по которой станция проезжала на своей последней орбите вокруг земли. Любые советы о том, как это сделать?

Заранее благодарен!

Редактировать 23-1-2015: Мне удалось обновить его непрерывно, создав новую переменную для iis, а именно iis2. Почему это не ясно для меня. К сожалению, все «старые» расположения маркеров не исчезают, поэтому я получаю размытую маркерную дорожку.

var iss; 
var iis2; 

function update_position() { 
    $.getJSON('http://open-notify-api.herokuapp.com/iss-now.json?callback=?', function(data) { 
     console.log(data); 
     var latitude = data["iss_position"]["latitude"]; 
     var longitude = data["iss_position"]["longitude"]; 
     if (!iss) { 
      iss2 = WE.marker([latitude,longitude]).bindPopup("I am the ISS").addTo(map); 
     } 
     iss2.setLatLng([latitude,longitude]).update(); 
    }); 
} 
update_position(); 
setInterval(update_position,1000); 

]

ответ

0

удалить маркер

var iss; 
var iis2; 

function update_position() { 
    $.getJSON('http://open-notify-api.herokuapp.com/iss-now.json?callback=?', function(data) { 
     console.log(data); 
     map.removeLayer(iss2); 
     var latitude = data["iss_position"]["latitude"]; 
     var longitude = data["iss_position"]["longitude"]; 
     if (!iss) { 
      iss2 = WE.marker([latitude,longitude]).bindPopup("I am the ISS").addTo(map); 
     } 
     iss2.setLatLng([latitude,longitude]).update(); 
    }); 
} 
update_position(); 
setInterval(update_position,1000);