Custom Component: Flightradar24

I was just about to post that I found it at Comment #170. :grin:

v1.16.0 Released

Changelog

v1.17.0 Released

Changelog

v1.18.0 Released

Changelog

v1.19.0 Released

Changelog

not sure if i am missing something but I am editing the URL for the map and I am getting an error

Configuration error
bad indentation of a mapping entry (2:13)

any ideas?

Itā€™s telling you your code structure is wrong for the card (or wherever you have)ā€¦specifically at line 2 character 13ā€¦
Though really you need to post your code with a query like this (see link) as itā€™s pretty difficult to help without seeing what you are trying to doā€¦

sorry as still new to the HA worldā€¦ this is what I have been trying to create

- type: entities
    entities:
      - entity: sensor.flightradar24_current_in_area
        name: In area
  - type: conditional
    conditions:
      - condition: numeric_state
        entity: sensor.flightradar24_current_in_area
        above: 0
    card:
      type: markdown
      content: >-
        {% set data = state_attr('sensor.flightradar24_current_in_area',
        'flights') %} {% for flight in data %}
          <ha-icon icon="mdi:airplane"></ha-icon>{{ flight.flight_number }}({{ flight.aircraft_registration }}) - {{ flight.airline_short }} - {{ flight.aircraft_model }}
          {{ flight.airport_origin_city }}{%if flight.airport_origin_city %}<img src="https://flagsapi.com/{{ flight.airport_origin_country_code }}/shiny/16.png" title='{{ flight.airport_origin_country_name }}'/>{% endif %} -> {{ flight.airport_destination_city }}{%
          if flight.airport_destination_country_code %}<img src="https://flagsapi.com/{{ flight.airport_destination_country_code }}/shiny/16.png" title='{{ flight.airport_destination_country_name }}'/>{% endif %}
          {%if flight.time_scheduled_departure %}Departure - {{ flight.time_scheduled_departure | timestamp_custom('%H:%M') }}; {% endif %}{%if flight.time_scheduled_arrival%}Arrival - {{ flight.time_scheduled_arrival | timestamp_custom('%H:%M') }}{% endif %}
          Altitude - {{ flight.altitude }} ft{%if flight.altitude > 0 %} ({{(flight.altitude * 0.3048)| round(0)}} m){% endif%}; Gr. speed - {{ flight.ground_speed }} kts{%if flight.ground_speed > 0 %} ({{(flight.ground_speed * 1.852)| round(0)}} km/h){% endif%}
          {% endfor %}
  - type: iframe
    url: >-
      https://www.flightradar24.com/simple?lat=51.32&lon=-0.56/14&z=ZOOM&label1=reg&size=small
    aspect_ratio: 100%

No worriesā€¦
YAML is very unforgiving of incorrect spacing/indentation so thatā€™s the error message you are getting

The specific error you are getting here is telling you that the indentation of the entities text you have is off (which is line 2, character 13)ā€¦so delete two spaces before entities and you will get past that error anyway.

The Indentation of the second card looks off too so youā€™ll prob get another error message.
- type: conditional is the start of a new card so should be aligned with - type: entities from the first lineā€¦
(there may be more (there definitely are) but work through it and see how you get on)

Hi, do you see a possibility for creating a HA ā€˜device_trackerā€™ for a specific ā€˜aircraft_registrationā€™ in the observed range? Thanks :blush:!

Im working on it. It would be an option that enable creating device tracking for callsign from additional tracked flights

1 Like

Thanks for a great component. Most of it worked perfectly out of the box, but I just canā€™t seem to get the map to display on the Lovelace card as described. Iā€™m sure I must be doing something stupid, but I just canā€™t see itā€¦


Its like Iā€™m zoomed in on a small section of the Flightradar websites page header - and canā€™t get to anything else.

The code in the card isā€¦

type: vertical-stack
title: Flightradar24
cards:
  - type: entities
    entities:
      - entity: sensor.flightradar24_current_in_area
        name: In area
  - type: conditional
    conditions:
      - condition: numeric_state
        entity: sensor.flightradar24_current_in_area
        above: 0
    card:
      type: markdown
      content: >-
        {% set data = state_attr('sensor.flightradar24_current_in_area',
        'flights') %} {% for flight in data %}
          <ha-icon icon="mdi:airplane"></ha-icon>{{ flight.flight_number }}({{ flight.aircraft_registration }}) - {{ flight.airline_short }} - {{ flight.aircraft_model }}
          {{ flight.airport_origin_city }}{%if flight.airport_origin_city %}<img src="https://flagsapi.com/{{ flight.airport_origin_country_code }}/shiny/16.png" title='{{ flight.airport_origin_country_name }}'/>{% endif %} -> {{ flight.airport_destination_city }}{%
          if flight.airport_destination_country_code %}<img src="https://flagsapi.com/{{ flight.airport_destination_country_code }}/shiny/16.png" title='{{ flight.airport_destination_country_name }}'/>{% endif %}
          {%if flight.time_scheduled_departure %}Departure - {{ flight.time_scheduled_departure | timestamp_custom('%H:%M') }}; {% endif %}{%if flight.time_scheduled_arrival%}Arrival - {{ flight.time_scheduled_arrival | timestamp_custom('%H:%M') }}{% endif %}
          Altitude - {{ flight.altitude }} ft{%if flight.altitude > 0 %} ({{(flight.altitude * 0.3048)| round(0)}} m){% endif%}; Gr. speed - {{ flight.ground_speed }} kts{%if flight.ground_speed > 0 %} ({{(flight.ground_speed * 1.852)| round(0)}} km/h){% endif%}
          {% endfor %}
  - type: iframe
    url: >-
      https://www.flightradar24.com/simple?lat=-34.99&lon=138.70&z=12&label1=reg&size=small
    aspect_ratio: 100%

What am I doing wrong?

Cheers.

Do you get a map view if you copy and paste the url of the iframe in a browser?
If i did that i get a map near Adelaid.
Connection/routing problem from HA device to internet?

Thanks Jurgen,

Yes - the map shows perfectly in the browser, and that is where I copied the url from.

My logic tells me that if the HA instance had no internet connectivity - it wouldnā€™t be displaying the logo from the website. Also, everything else in HA that relies on internet is working fineā€¦

Not sure the fix but when I use your url in a browser the image you have posted loads for a split second then refreshes to the correct view for your lat/longā€¦
Have you tried a diff browser, clear cache, etc

Hello, How I can find KL123 in my agenda ?

^kl.\d{3,4}.
?
Thanks

Hmm. My browser of choice on desktop machines is Firefox - and it is through that I have seen the issue - on two different pcā€™s (one Windows the other Linux). Just checked through Firefox on my Android - and it worked. Also, just loaded Chrome on the windows machine Chromium on the Linux machine and they both worked as well.

I tried different lon/lat but that made no difference.

Surely Iā€™m not the only person in the world still using Firefox on a desktop machine!!

Sorry, I did not find the answer to the question below. Apologies if it has already been answered
Does anyone know if itā€™s possible in this integration to have separate sensors, like sensor.flightradar24_current_in_area, based on the deviceā€™s geo-coded location, which would depend on the currently used device? For example, when I use this integration with my mobile phone, I want to observe airplanes within a 2 km radius of my phoneā€™s current geo-coded location (latitude/longitude).
When Iā€™m home, this observed location would be also different, but always with the same (fixed) latitude/longitude.
In the Flightradar24 integration, we currently provide only fixed latitude/longitude coordinates. Is it possible for this data to be dynamic, constantly adapting, for example to mobile phones within a specified radius?

If not, is there a possibility of adding this feature in future versions?

Otherwise, great integrationā€”much appreciated !

1 Like

is it possible to show the latest 10 flights in the area?
or do I need to build something for that?

v1.21.0 Released

Changelog

Track flights as device_tracker with flight information. To use it - you need to activate this feature
in Configuration. When it is enabled - this integration creates device_tracker
for every additional tracked flight from sensor.flightradar24_additional_tracked.

To create device_tracker for a flight:

  1. Add a flight to Additional tracked by flight number
  2. Use device_tracker device_tracker.FLIGHT_NUMBER.