Web Development Question - flags files

I would like to track specific theme planes as they fly though the area. I have gotten into the flags.js file and segregated a few planes out from the pack and dump1090 is identifying them properly. However, my flag png files do not seem to want to work. I have an example here of what I am doing:

This is a picture of a flight arriving with the Country of Registration altered. However, the flag file in both the aircraft info above and in the aircraft list below (gray line) do not display a flag. Here is the text from the flag.js file:

        { start: 0xA00000, end: 0xA720EA, country: "United States of America", flag_image: "United_States_of_America.png" },
        { start: 0xA720EB, end: 0xA720EB, country: "Salmon Thirty Salmon N559AS", flag_image: "SALMON.png" },
        { start: 0xA720EC, end: 0xA7AC53, country: "United States of America", flag_image: "United_States_of_America.png" },
        { start: 0xA7AC54, end: 0XA7AC54, country: "Alaska Airlines", flag_image: "United_States_of_America.png" },
        { start: 0xA7AC55, end: 0xA7E150, country: "United States of America", flag_image: "United_States_of_America.png" },
        { start: 0xA7E151, end: 0xA7E151, country: "TIMBERS!!!", flag_image: "TIMBERS.png" },
        // { start: 0xA7E152, end: 0xAFFFFF, country: "USA", flag_image: "United_States_of_America.png" },
        { start: 0xA7E152, end: 0xACAA76, country: "United States of America", flag_image: "United_States_of_America.png" },
        { start: 0xACAA77, end: 0xACAA77, country: "TWA Theme Plane", flag_image: "TWA.png" },
        { start: 0xACAA78, end: 0xAFFFFF, country: "United States of America", flag_image: "United_States_of_America.png" }, 

In the case of the Timbers aircraft, A7E151, the flag displays correctly. In the case of N559AS and the TWA plane, the flag files do not display as desired. Here are the images for the alternate flags I am using:

The file names are correct in the code above. The alternate flag pictures were pulled from various web sites and converted to png files using photoshop. The Timbers file works properly and the TWA and Salmon files both error. Any thoughts on what I am doing incorrectly with my alternate flag files that will not display on my map? How do I correct the problems?

Thank you

This is just a guess without trying it, but I suspect that the aspect ratio of the salmon and twa files are invalid for dump1090.

All of the other flags in the flags-tiny folder are 20x12 pixels. The aspect ratio is 5:3

Your flag file is very close to that, the other two have massively different aspect ratios.

Try resizing the other two files so they are exactly 100 px wide. Then, pad top and bottom so that they are exactly 60 px tall.

One other way to test to ensure your files will work is to save a copy of United_States_of_America.png somewhere, then take your file to be tested and rename it to United_States_of_America.png. If the american flag is not replaced with your file, then your file is not yet compatible with dump1090.

Honestly, if it was me, I would resize your files to exactly 20x12 so that your browser doesn’t have to do that resize.

But testing by replacing the USA png file ensures that the files aren’t the problem.

Oh, and your json file is invalid. Comments of the form //… or // are not allowed in JSON.

Douglas Crockford, who invented the JSON data format has this to say:

I removed comments from JSON because I saw people were using them to hold parsing directives, a practice which would have destroyed interoperability. I know that the lack of comments makes some people sad, but it shouldn’t.

Suppose you are using JSON to keep configuration files, which you would like to annotate. Go ahead and insert all the comments you like. Then pipe it through JSMin before handing it to your JSON parser.
Source: Public statement by Douglas Crockford on G+

So, actual working json files CAN NOT HAVE // COMMENTS IN THEM. however, JSmin will remove them, and so you can have your SOURCE.json file and SOURCE.min.json and use the latter.

Of course, even if you do get them to work, the fish plane will be unrecognizable… Here it is at 20x12.

Here it is >>>> http://www.vocshop.com/n0oxf/fish_tiny.png <<<< Don’t miss it.

and here’s the twa image at 20x12…

here >>>>>http://www.vocshop.com/n0oxf/twa_tiny.png<<<<<< Don’t over look it by accident.

Thank you Rick. I finally got some time to play with these. I reformatted my TWA a few different times using the different sizes and ratios to no success. I used the TWA file you so kindly created and still no success. Here is a screen shot of the TWA file being used in the place of the US flag:

I did look at the Timbers flag file, it does not match the ratios you mentioned. N607AS flew through the area today and that flag appeared without issues. Any thoughts why that file might work while the others error out?

On a separate note, i did remove the commented line in the text. However, at the end of the flags.js file are many commented lines.

Comments at the END of the json file are not a problem. Comments in the middle can stop parsing.

OK, let’s try some basic debugging stuff.

  1. open united_states_of_america.png in paint or photoshop or something.

  2. edit it… make an x on it or something.

  3. save it back and see if your edited copy shows.

  4. check the parameters on the png’s… what is the color space? 24 bit or 32 or what?

  5. try copying canada.png over united_states_of_america.png

the idea being, CAN YOU CHANGE 1IT? because it clearly didn’t like twa_tiny.png.

Try replacing a file with a BMP instead of a PNG…

Eventually, you will get a file that works in place of USA and you can then drop it in for TWA and Alaska…

It’s not a json file.

ahhhh. Its a ,js ooops.

the idea being, CAN YOU CHANGE 1IT? because it clearly didn’t like twa_tiny.png.

Try replacing a file with a BMP instead of a PNG…

Well, still nothing has worked. I have used MS Paint and Photoshop CS3 to make BMP, JPG and PNG files and nothing is working. I would think changing the name of a file as you have suggested and that did not work. I think it is time to get out my old RPi and start with a fresh set up and see if that works.