Search code examples
ruby-on-railsopenweathermap

How to display icon with openweather api in rails app


I tried to display icon with openweather api.

It work this

_else.html.erb
.
.
 <div class="tenki">
    <h2>Tokyo</h2>
    <img src="http://openweathermap.org/img/wn/[email protected]">
.
.

but this is only "10d" pattern. I want to show icon at that time.

so try this..

static_pages_controller.rb

.
.
.
 uri = URI.parse("http://api.openweathermap.org/data/2.5/weather?q=Tokyo&appid=#{ENV['OPEN_WEATHER_API_KEY']}")
    json = Net::HTTP.get(uri)
    res = JSON.parse(json)
    @wind = res['wind']['speed']
    @humidity = res['main']['humidity']
    @clouds = res['clouds']['all']
    @icon = res['weather'][0]['icon']
_else.html.erb
.
.
 <div class="tenki">
    <h2>Tokyo</h2>
    <img src="http://openweathermap.org/img/wn/#{@icon}.png">
.
.

but this won' work.. and this is not error so error code is none. Browser showed only tiny picture which is broken.

Anyone fix it? please teach me.

thank you for reading this.


Solution

  • You need to use ERB tags <%= %> in order for the parser to actually evaluate the code.

    <img src="http://openweathermap.org/img/wn/<%= @icon %>.png">
    

    The normal string interpolation sequence #{} has no special significance in ERB and will just be output as is.

    You can also use the image_tag helper:

    <%= image_tag "http://openweathermap.org/img/wn/#{@icon}.png" %>