Openweather APIの言語を変更してください

Question

私は質問に迅速にしようとします。私は私が見たアディダスUltraboost TRサイトのように、このcodepen

var weatherData = { 
 
    city: document.querySelector ("#city"), 
 
    weather: document.querySelector ("#weather"), 
 
    temperature: document.querySelector("#temperature"), 
 
    temperatureValue: 0, 
 
    units: "°C" 
 
    
 
}; 
 

 
function roundTemperature(temperature){ 
 
\t \t \t temperature = temperature.toFixed(1); 
 
\t \t \t return temperature; 
 
\t \t } 
 

 
function switchUnits(){ 
 
    
 
    if (weatherData.units == "°C") { 
 
    weatherData.temperatureValue = roundTemperature(weatherData.temperatureValue * 9/5 + 32); 
 
    weatherData.units = "°F"; 
 
    
 
} else { 
 
    weatherData.temperatureValue = roundTemperature ((weatherData.temperatureValue -32) * 5/9); 
 
    weatherData.units = "°C"; 
 
} 
 

 
    weatherData.temperature.innerHTML = weatherData.temperatureValue + weatherData.units + " "; 
 
} 
 

 

 
function getLocationAndWeather(){ 
 
    if (window.XMLHttpRequest){ 
 
    var xhr = new XMLHttpRequest(); 
 
    xhr.addEventListener("load", function() { 
 
     var response = JSON.parse(xhr.responseText); 
 

 
     console.log(response); 
 
     var position = { 
 
     latitude: response.latitude, 
 
     longitude: response.longitude 
 
     }; 
 
     var cityName = response.city; 
 

 
     var weatherSimpleDescription = response.weather.simple; 
 
     var weatherDescription = response.weather.description; 
 
     var weatherTemperature = roundTemperature(response.weather.temperature); 
 

 
     weatherData.temperatureValue = weatherTemperature; 
 

 
     loadBackground(position.latitude, position.longitude, weatherSimpleDescription); 
 
     weatherData.city.innerHTML = cityName; 
 
     weatherData.weather.innerHTML = ", " + weatherDescription; 
 
     weatherData.temperature.innerHTML = weatherTemperature + weatherData.units; 
 
    }, false); 
 

 
    xhr.addEventListener("error", function(err){ 
 
     alert("Could not complete the request"); 
 
    }, false); 
 

 
    xhr.open("GET", "https://fourtonfish.com/tutorials/weather-web-app/getlocationandweather.php?owapikey=e2db5b0453a25a492e87ad8b03046a7c&units=metric", true); 
 
    xhr.send(); 
 
    } 
 
    else{ 
 
    alert("Unable to fetch the location and weather data."); 
 
    }   
 
} 
 

 

 
function loadBackground(lat, lon, weatherTag) { 
 
    var script_element = document.createElement('script'); 
 

 
    script_element.src = "https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=1452866c8cea54acd0075022ef573a07&lat=" + lat + "&lon=" + lon + "&accuracy=1&tags=" + weatherTag + "&sort=relevance&extras=url_l&format=json"; 
 
    
 
    document.getElementsByTagName('head')[0].appendChild(script_element); 
 
} 
 

 
function jsonFlickrApi(data){ 
 
    if (data.photos.pages > 0){ 
 
    //var randomPhotoId = parseInt(data.photos.total); 
 
    var photo = data.photos.photo[Math.floor(Math.random()*parseInt(data.photos.photo.length))]; 
 
    document.querySelector("body").style.backgroundImage = "url('" + photo.url_l + "')"; 
 
    document.querySelector("#image-source").setAttribute("href", "http://www.flickr.com/photos/" + photo.owner + "/" + photo.id); 
 
    } 
 
    else{ 
 
    document.querySelector("body").style.backgroundImage = "url('https://fourtonfish.com/tutorials/weather-web-app/images/default.jpg')"; 
 
    document.querySelector("#image-source").setAttribute("href", "https://www.flickr.com/photos/superfamous/310185523/sizes/o/"); 
 
    } 
 
} 
 

 
getLocationAndWeather();

body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
    font-family:Arial, sans-serif; 
 
    font-size: 2em; 
 
    text-shadow: 0 0 10px #000; 
 
    color: #fff; 
 
    background: #888; 
 
    bacground-repeat: no-repeat; 
 
    background-attachment: fixed; 
 
    background-size: cover; 
 
} 
 

 
section { 
 

 
    min-height: 100%; 
 
} 
 

 
h1 { 
 
    font-size: 2em; 
 
    padding: 0 0.3em; 
 
    line-height: 1em; 
 
    
 
} 
 

 
p { 
 
    padding: 0 1em; 
 
} 
 

 
a{ 
 
    color: #fff; 
 
} 
 

 
footer { 
 
    position: absolute; 
 
    bottom: 0; 
 
    font-size: 0.5em; 
 
} 
 

 
#temperature { 
 
    text-decoration: none; 
 
    border-bottom: 0.05em dotted white; 
 
}

<section> 
 
    <h1 id= "city">Weather Web App</h1> 
 
    <p> <a id="temperature" href="#" onclick="switchUnits(); return false;" title ="Click to switch between metric and impreial units"></a><span id = "weather"> by Shazam (tutorial from @fourtonfish)</p> 
 
</section> 
 

 
<footer> 
 
    <p>Powered by <a href="http://flickr.com/services/api/">Flickr</a> and <a href="http://openweathermap.org">Openweathermap.org</a>. 
 
    
 
    Created by <a href="https://twitter.com/steelcitycoach">@steelcitycoach</a>. <a id="image-source" href="#">Image source</a>.</p> 
 
    
 
</footer>

はPHPと異なる結果を生成するために使用して、不動産の天気予報を使用したい...

問題： "description"をポルトガル語（pt-br）に変更することはできません。 URLに "& lang = pt"を含めるように言ったOpenWeatherのドキュメントはすでに見てきましたが、うまくいきませんでした。問題を解決するには、これはこのコードの所有者のサイトですが、私はthis pageへのアクセス権を持っていません。私は設定やそのようなものを変更できると思います。 「晴天」、< -

： -

「天気」：：：{ 「シンプル」>「説明」「クリア」、 スニペットを実行する場合、これは私が応答に変更することができるものです

だから、私はあなたが私を助けることができると思う2つの方法があります：

1. は私にデPHPを変更することなく、「CEUはlimpo」またはそれにportguese同等のために、「晴天」に変更する方法を知らせますファイル：

2. Giv私はPHPを使用して応答を変更する光。例：私が "空の空"応答を受け取った場合、私はそれを "céulimpo"に変更します。

あなたは私を助けてくれますか？

Answer 1

翻訳サービスを使用して、説明を任意の言語に翻訳できます。

function translateDescription(description) { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.open("GET", "https://translate.googleapis.com/translate_a/single?client=gtx&sl=en&tl=pt&dt=t&q=" + description, false); 
    xhttp.send(); 
    var response = JSON.parse(xhttp.responseText); 
    return response[0][0][0]; 
} 

私はこれを行うためにビットをフォークし、あなたのCodePenを変更：

は例えば、ここでは、文字列を受け取り、GoogleがAPIを翻訳呼び出し、およびポルトガル語に翻訳された文字列を返すJavaScript関数です。基本的には、var weatherDescriptionの46行目で、OpenWeatherMap APIから返された説明文字列で上記の関数translateDescriptionを呼び出します。

CodePen：https://codepen.io/anon/pen/GMwWoR