如何將json的天氣圖標更改爲天氣圖標我吸引了我自己

我試圖將我從API獲取的天氣圖標更改爲我自己在Photoshop中繪製的天氣圖標！我的變量是法語的，評論也是如此，如果你需要翻譯來理解我的代碼，請問！如何將json的天氣圖標更改爲天氣圖標我吸引了我自己

<script type="text/javascript"> 
     jQuery(document).ready(function($) { 
      var maLatitude;  /*Variable gobale contenant la latitude*/ 
      var maLongitude; /*Variable gobale contenant la longitude*/ 

      if (navigator.geolocation) 
       navigator.geolocation.getCurrentPosition(showPosition); 
      else 
      alert("Votre navigateur supporte pas la géolocalisation, essayez de mettre à jour votre navigateur!"); 
     }); 

     function showPosition(position){ 
      maLatitude= position.coords.latitude; 
      maLongitude= position.coords.longitude; 

     $.ajax({ 
      url : "http://api.wunderground.com/api/API_KEY/geolookup/conditions/lang:FC/q/"+maLatitude+","+maLongitude+".json", 
      dataType : "jsonp", 
      success : function(parsed_json) { 

       var location = parsed_json['location']['city']; 
       var temp_c = parsed_json['current_observation']['temp_c']; 
       var tempRessentie = parsed_json['current_observation']['feelslike_c']; 
       var wicon = parsed_json['current_observation']['icon']; 
       var condition = parsed_json['current_observation']['weather']; 
       var vent_kmh = parsed_json['current_observation']['wind_kph']; 
       var rafales = parsed_json['current_observation']['wind_gust_kph']; 
       var visibilite = parsed_json['current_observation']['visibility_km']; 

       $("div.ville").append("<div class='endroit'>" + location + " </div>"+ 
             "<div class='temp'>" + temp_c + " °C</div>"+ 
             "<div> Temp. ressentie : "+tempRessentie+" °C</div>"+ 
             "<div class='triangle'></div>"+ 
             "<div class='icone'><img src='http://icons-ak.wxug.com/i/c/k/"+wicon+".gif' alt='"+condition+"' title='"+condition+"'/></div>"+ 
             "<div class='condition'>"+condition+"</div>"+ 
             "<div>Vent : "+vent_kmh+" km/h</div>"+ 
             "<div>Rafales : "+rafales+" km/h</div>"+ 
             "<div>Visibilité : "+visibilite+" km</div>"); 
       } 
     }); 
    } 
    </script>

來源

2014-01-30 FebreezeCan

那麼，有什麼問題嗎？只要將'img''src'改成任何你想要的。 –

但是如果我改變它到另一個src它只會給我一個特定的天氣圖標，除非有另一種方式做它我沒有想到？：O – FebreezeCan

基本上取決於當天的天氣情況，加載頁面時會出現不同的天氣圖標！但我自己畫了一些天氣圖標，我希望能夠根據當天的天氣加載它們！ – FebreezeCan

所以就在這裏：

"<div class='icone'><img src='http://icons-ak.wxug.com/i/c/k/"+wicon+".gif' alt='"+condition+"' title='"+condition+"'/></div>"

將其更改爲：

"<div class='icone'><img src='http://YourServer.com/yourIcons/"+ wicon +".gif' alt='"+condition+"' title='"+condition+"'/></div>"

並確保你的圖標被命名爲它們具有相同的。

現在，如果你堅持要有不同的名字，你需要將他們的名字映射到你的名字，這應該是相當平凡的。

來源

2014-01-30 20:49:11

謝謝！我沒有想到這一點！ – FebreezeCan

請注意，如果您尚未爲** all **圖標創建替換項，可能會發生什麼情況。如果圖標名稱是您認識的圖標名稱，我會建議添加更多的邏輯來僅執行上述操作。 – Snixtor

@Snixtor：可能會發生什麼是一個斷開的鏈接圖標。幾乎沒有世界末日。但是，是的，如果我這樣做，我會添加更多的邏輯來映射我知道的圖標的條件，如果我不知道它的圖標，就完全忽略圖標。我也會確保我將我認爲比他們的圖標文件名更穩定的東西關掉，因爲它可能會改變。但是這一切似乎都是OP的頭條。 –

創建對象的把網址爲每個天氣圖標到對象與代表天氣狀況的名稱，然後獲得通過使用正確的名稱正確的網址：

var weatherIcons = { 
    snowy:"/snowyicon.jpg", 
    rainy:"/rainyicon.jpg", 
    sunny:"/sunnyicon.jpg" 
}; 

... 

var condition = parsed_json['current_observation']['weather']; 
var iconTOUse = weatherIcons[condition]; 

var element = '<img src="'+iconTOUse+'" />';

來源

2014-01-30 20:49:58

如何將json的天氣圖標更改爲天氣圖標我吸引了我自己

回答

相關問題