I am trying to implement changing the temperature displayed from Fahrenheit to Celsius but can’t seem to get it to display a change in selection of my radio buttons. However, when I press the Fahrenheit radio button, my message does not display as the condition never seems to be true.
The html code is
div id = "data">
<h4>You are here:</h4>
<p class="message"> the</p>
</div>
<div class="card" style="width:20rem;">
<img class="card-img-top img-fluid" id="imageid" src="https://cdn.pixabay.com/photo/2017/05/09/16/06/windsurfing-2298647__340.jpg" alt="Card image" alt="Card image cap">
<div class="card-body">
<h2 class="card-title" id="loc"> jkl;kj</h2>
**<form>**
** <input type="radio" name="tscale" id="fscale" value="ft"> Fahrenheit<br>**
** <input type="radio" name="tscale" id="cscale" value="ct"> Celsius<br>**
** <input type="radio" name="tscale" id="kscale" value="kt"> Kelvin<br>**
** </form>**
</div>
</div>
and the Javascript code is:
var xcoord;
var ycoord;
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
xcoord = position.coords.longitude;
ycoord = position.coords.latitude;
console.log ("the x coord is: ", xcoord, " and the y coord is: ", ycoord);
$.getJSON("https://fcc-weather-api.glitch.me/api/current?lon=" + xcoord + "&lat=" + ycoord, function(json) {
$(".message").html(JSON.stringify(json));
var tempcel = json.main.temp;
var tempfah = Math.round(1.8 * tempcel + 32);
var windspeedkts = json.wind.speed;
var conditions = json.weather[0].description;
var city = json.name;
var country = json.sys.country;
console.log('the Temp is ', tempcel, "C or ", tempfah, "F");
console.log('the wind speed is ', windspeedkts, " knots");
console.log('the weather is ', conditions);
console.log('the location is ', city, " in ", country);
console.log("the weather icon is: ", json.weather[0].icon);
document.getElementById("imageid").src=json.weather[0].icon;
if (**document.getElementById('fscale').checked**) {document.getElementById("loc").innerHTML = "The current weather for " + json.name + " in " + json.sys.country + " is " + json.weather[0].description + ", the Temp is " + tempfah + " and the wind speed is " + json.wind.speed + " knots.";}
});
});
}
Matt
