Does anybody know how to integrate the “aircraft_photo_medium”
i guess i am missing the URL for the picture?
- type: markdown
content: >
<img src="https://{{ aircraft_photo_medium }}">
The data you are looking for is stored as an attribute of the sensor generated by this integration so a simple {{ aircraft_photo_medium }} won’t work as this is not a sensor. You need to identify to the markdown card that it’s the attributes of the sensor you want to show.
Looking at the examples above and on GitHub you need something like this for your card
(and just to say not expert in templating/variables so might be off here, but it’s in the general direction I think)
card:
type: markdown
content: >-
{% set data = state_attr('sensor.flightradar24_current_in_area',
'flights') %} {% for flight in data %}
<img src="https://{{ flight.aircraft_photo_medium }}">
have a look on GitHub (card example just just above this anchor) GitHub - AlexandrErohin/home-assistant-flightradar24: Flightradar24 integration for Home Assistant
how do i find out if “{{ flight.aircraft_photo_medium }}” is only a part of the url?
or what is actually the data behind “{{ flight.aircraft_photo_medium }}”?
because its not working;)
You are best to have a look at the Attributes of the Sensor when they are populated…the attributes are a List (I think) of each flight under an attribute called Flights but they only populate when the sensor.flightradar24_current_in_area is greater than zero (ie there is a flight in the area you are tracking).
So when there is a flight in your area, all attributes populate but there is nothing there when no flight in the tracked area (which is logical)…the code I posted for the Markup Card tells the card to read all the attributes (into a variable called “flights”) and then you are selecting the aircraft_photo_medium attribute from the variables you’ve just read…
(that’s my understanding of it anyway…as I say best to look at the attributes of the sensor when there is a flight around and you’ll see all the data then)
here is the working solution:
- type: markdown
content: >-
{% set flight = state_attr('sensor.flightradar24_current_in_area',
'flights')[0] %}
<img src="{{ flight.aircraft_photo_large }}"></img>
Glad you got it working.
That’ll show the data from the first flight in the list (which might be all you want) but if the sensor shows more than one flight in the tracked area your card will still only show the first one as long as you specify [0] in your code 
You can do it using HA’s built in Utility Meter Custom Component: Flightradar24 - #97 by chintito4ever
Based on the code of @bacco007 (thanks!) I made a simpler table (less information) but including the country flags of the origin and destination.
type: custom:flex-table-card
strict: false
sort_by:
- flights-
entities:
include: sensor.flightradar24_current_in_area
card_mod:
style: |
ha-card {
background: none;
border: 0;
box-shadow: none;
overflow: auto;
padding-top: 5px;
font-size: 12px;
}
tbody tr:hover {
background-color: coral !important
}
css:
table+: 'padding: 16px 0px 16px 16px;'
tbody tr+: 'user-select: text'
tbody tr td:nth-child(2)+: 'min-width: 1fr;width: 1fr;'
tbody tr td:nth-child(3)+: 'min-width: 1fr;width: 1fr;'
tbody tr td:nth-child(4)+: 'min-width: 1fr;width: 1fr; white-space: nowrap;'
tbody tr td:nth-child(5)+: 'min-width: 1fr;width: 1fr;'
th+: 'border-bottom: 1px solid rgb(127,127,127);'
columns:
- name: TAIL
data: flights
align: center
modify: |
if(x.airline_icao != null)
'<img src="https://content.airhex.com/content/logos/airlines_' + x.airline_icao + '_50_50_f.png?proportions=keep">'
else {
'<img src="https://content.airhex.com/content/logos/airlines_' + x.airline_icao + '_50_50_f.png?proportions=keep">';
}
- name: REGO
data: flights
align: center
modify: |
if(x.aircraft_registration != null)
{x.aircraft_registration}
else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
- name: ALT (m)
data: flights
align: center
modify: |
if(x.altitude != null)
{var data = x.altitude * 0.3048;
data.toFixed(0)
}
else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
- name: SPD (km/h)
data: flights
align: center
modify: |
if(x.ground_speed != null)
{var data = x.ground_speed * 1.852;
data.toFixed(0)
}
else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
- name: ORIGIN
data: flights
modify: |
if(x.airport_origin_name != null) {
var countryFlag = '';
if (x.airport_origin_country_code) {
countryFlag = '<img src="https://flagsapi.com/' + x.airport_origin_country_code + '/shiny/16.png" title="' + x.airport_origin_country_name + '"/> ';
}
countryFlag + x.airport_origin_city;
} else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
- name: DESTINATION
data: flights
modify: |
if(x.airport_destination_name != null) {
var countryFlag = '';
if (x.airport_destination_country_code) {
countryFlag = '<img src="https://flagsapi.com/' + x.airport_destination_country_code + '/shiny/16.png" title="' + x.airport_destination_country_name + '"/> ';
}
countryFlag + x.airport_destination_city;
} else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
Very nice and thanks (both) for sharing - I’m going down same path tailoring to my preferences. Not a big deal, but I prefer / relate to aircraft altitude better in feet than metres (so have set accordingly) - my question I’ve struggled to get working á display template that shows these larger numbers with thousands separator (eg: rather than 35000 show 35,000ft. Tried for example this
- name: ALT (Ft)
data: flights
align: center
modify: |
if(x.altitude != null)
{{"{:,}".format(var data = x.altitude;
data.toFixed(0)}}
}
else {
'<span style="color:grey;"><i>' + "N/A" + '</i></span>';
}
- name: SPD (km/h)
Hello everyone,
This is an awesome addition to HA! We live on the approach to London Heathrow and my wife loves watching the planes so have a couple of ideas to put this to good use.
I would ideally like to be able to trigger an automation if a particular plane of interest is overhead - any Boeing 747, and any Airbus A380. I am using a lovelace card that shows the information but not clever enough to work out how to do what i want - is anyone able to help me?
Thanks,
Joel.
Wow this looks like exactly the sort of thing im looking for. I want to be able to able to track and display what aircraft im currently on as a crew member. Is it possible to constantly update the plane tracked by departure date and flight number so i can load my roster in and let it do its thing?
How do you get a photo of each plane when there’s more than one? (If I delete [0] from mm2001mm’s code I don’t get any flight info.)
have a look at my original reply here Custom Component: Flightradar24 - #123 by Gav_in and it’ll point to the general idea of how to pull all the flights that might be overhead at any time (essentially looping through any/all flights in the List and showing the Attributes for each individually)
Hi all - still experimenting with this great resource. I recently added current heading of the aircraft (measurement: degrees) intending to convert that to a compass heading for verbal announcements, my question is this heading appears (to me) to be static - I’m guessing heading when Aircraft entered zone - is that correct? And is there a way to see / get update heading info while aircraft is in zone?
Thanks
Hi
The heading updates with latitude, altitude and ect.
BUT if your zone is not near to an airport, then the heading would not be changing mostly. The aircraft changes the heading mostly on landing or taking off
Great thanks - makes sense
Appreciate reply
Is there a way to drop the characters after the “-” in aircraft model? I am using it to notify a media player and I would rather it just state “Boeing 737” than “Boeing 737-800” which is pronounced “Boeing 737 to 800” when notified. The aircraft_code is too short for my application.
Can you not just template the value you want announced from the “long” aircraft model stopping / splitting at the hyphen.
(Don’t think it’s really an issue/question for this Integration)