Some custom SVG plane icons...


#1

Thought it would be nice to share :slight_smile:

Created these from scratch my using a 64x64 grid overlay on a top view image of the aircraft. I have only used straight lines and I could have used integers to make them more accurate however at the scale they are being used I think they look OK.

They are quite simple graphics compared with the ones included in PiAware3 but do the trick.

I have applied these as the basis of my aircraft categories, i.e. the A320 is used for small_twin_jet which is used for A320’s and B737s.

Airbus A320
(small_twin_jet)
https://dl.dropboxusercontent.com/u/50785283/A320.jpg

*var _a320_svg =
“m 32,1 2,1 2,3 0,18 4,1 0,-4 3,0 0,5 17,6 0,3 -15,-2 -9,0 0,12 -2,6 7,3 0,2 -8,-1 -1,2 -1,-2 -8,1 0,-2 7,-3 -2,-6 0,-12 -9,0 -15,2 0,-3 17,-6 0,-5 3,0 0,4 4,-1 0,-18 2,-3 2,-1z”;
*

Boeing 777
(large_twin_jet)
https://dl.dropboxusercontent.com/u/50785283/B777.jpg

*var _b777_svg =
“m 32,1 2,1 1,2 0,20 4,4 0,-4 3,0 0,4 -1,2 17,12 0,2 -16,-5 -7,0 0,13 -1,5 7,5 0,2 -8,-2 -1,2 -1,-2 -8,2 0,-2 7,-5 -1,-5 0,-13 -7,0 -16,5 0,-2 17,-12 -1,-2 0,-4 3,0 0,4 4,-4 0,-20 1,-2 2,-1z”;
*

Bombardier Q300 (Dash8)
(medium_twin_prop)
https://dl.dropboxusercontent.com/u/50785283/DASH8.jpg

var _dash8_svg =
“m 32,1 3,4 0,20 4,0 0,-5 1,-1 1,1 0,5 17,2 0,3 -17,2 0,3 -1,1 -1,-1 0,-3 -4,0 0,15 -1,8 6,0 1,1 0,3 -8,0 -1,1 -1,-1 -8,0 0,-3 1,-1 6,0 -1,-8 0,-15 -4,0 0,3, -1,1 -1,-1 0,-3 -17,-2 0,-3 17,-2 0,-5 1,-1 1,1 0,5 4,0 0,-20 3,-4z”;

Beechcraft Super King Air B200
(small_twin_prop)
https://dl.dropboxusercontent.com/u/50785283/B200.jpg

var _b200_svg =
“m 32,1 1,0 1,2 1,4 0,5 5,0 0,-5 -1,-1 2,-2 2,2 -1,1 0,5 17,2 0,3 -17,3 0,1 -2,0 0,-1 -5,0 0,5 -2,8 6,3 0,2 -6,-1 -1,0 -6,1 0,-2 6,-3 -2,-8 0,-5 -5,0 0,1, -2,0 0,-1 -17,-3 0,-3 17,-2 0,-5 -1,-1 2,-2 2,2 -1,1 0,5 5,0 0,-5 1,-4 1,-2 z”;

And lastly I use this dull triangle instead of default:
var _triangle_svg =
“m 32,0 32,64 -64,0z”;

I use the existing heavy, light and rotorcraft icons for now for other types.


Wrong aircraft icons in 3.5.0?
Ground Vehicles
New SVG's - Aircraft Icons
#2

Some private jets knocking around so added this:

Gulfstream G650
(private_jet)
https://dl.dropboxusercontent.com/u/50785283/G650.jpg

var _g650_svg =
“m 32,1 1,0 1,2 1,4 0,10 21,17 0,5 -2,-2 -16,-8 -3,0 0,3 2,0 1,1 0,5 -1,1 0,3 -2,0 0,1 7,5 0,3 -9,-3 -1,0 -9,3 0,-3 7,-5 0,-1 -2,0 0,-3 -1,-1 0,-5 1,-1 2,0 0,-3 -3,0 -16,8 -2,2 0,-5 21,-17 0,-10 1,-4 1,-2z”;


#3

Got an airforce base nearby too so another icon for the set:

Lockheed C-130H Hercules
(medium_four_prop)
https://dl.dropboxusercontent.com/u/50785283/C130.jpg

var _c130_svg =
“m 31,1 1,0 1,1 1,2 0,8 3,0 0,-3 1,-1 1,1 0,3 6,0 0,-3 1,-1 1,1 0,3 10,1 0,2 -1,1 -17,3 -5,0 0,10 -1,1 8,2 0,1 -1,1 -8,0 -1,1 -1,-1 -8,0 -1,-1 0,-1 8,-2 -1,-1 0,-10 -5,0 -17,-3 -1,-1 0,-2 10,-1 0,-3 1,-1 1,1 0,3 6,0 0,-3 1,-1 1,1 0,3 3,0 0,-8 1,-2 1,-1 z”;


#4

they’re great, thanks for sharing them


#5

I added these to dump1090-mutability (thanks!) plus some support stuff so they are used based on aircraft type when that is available from the static json DB.

They are currently scaled approximately according to the actual aircraft size, but that might need a fudge factor since there is such a range of aircraft sizes.

I only added a few of the most obvious types; if anyone wants to add some more type mappings or new icons etc then pull requests would be great!

Also, I rearranged the json db stuff in tools/ so it is easier to update the DB; there is a script that reads from a CSV file and regenerates the DB, so you can edit the CSV directly or write a tool to generate a CSV from whatever other datasource you have.


#6

@IAUCKLAN63
@obj
Thanks!


#7

I’d like to see one for the balloons – I’m currently tracking HBAL417, 62100 feet, 18 knots!

bob k6rtm


#8

Not all the balloons are recognized as balloons. They can probably more accurately be recognized by finding aircraft above 50,000 ft traveling at less than 30 knots. I’m currently tracking HBAL449, which is currently at 53,800 and 5 knots. It’s been nearly stationary near the western edge of my feeder’s range. I’ve been hoping it would slowly drift westward to serve as a way to check the extend of the range I’m getting. Curiously, I get more range toward the southwest and even east than west, and I don’t think that’s because of local topography. If it is, then it’s the topography about 3 miles from me that’s relevant (it’s about 200 feet higher than me).

The highest obstacle to the west is about half a degree above 0. The lowest obstacle (from northeast to SSW, is about -0.25 degrees.


#9

that sounds good, I will have to have a look


#10

Thanks all for the positive feedback :smiley:

Will try and do a balloon icon, however as the aircraft are a top down view, a balloon would just be a circle. Will do a balloon shape too but it will appear in strange orientations due to the way the graphics are drawn assuming a top-down view.

Got to throw a few more together, spotted a glider out this way on the weekend…


#11

Trans Tasman friends,

The update is nice. I now see heavy twins as well as heavy four engines.
I also see what looks like little Cessnas or GA Singles.

My only suggestions would be:-
Gliders
Vehicles
Balloons(already requested)


#12

Here are a couple of new ones, the balloon was hard work, not sure the scale is quite right on the glider/sailplane

Sailplane/Glider
(sailplane)
https://dl.dropboxusercontent.com/u/50785283/sail_plane.jpg

var _sailplane_svg =
“m 31,1 1,0 1,2 1,4 1,6 0,3 16.5,0 11,2 1,2 -21,2 -8,0 -1,5 -1,15 0,4 4,0 5,1 0.5,1 0,1 -11,0 0.5,2 0.5,-2 -11,0 0.5,-1 0,-1 5,-1 4,0 0,-4 -1,-15 -1,-5 -8,0 -21,-2 1,-2 11,-2 16.5,0 0,-3 1,-6 1,-4 1,-2 z”;

Balloon
(balloon)
https://dl.dropboxusercontent.com/u/50785283/Balloon.jpg

var _balloon_svg =
“m 27,1 10,0 3,1 3,1 1,1 2,1 6,6 1,2 1,1 1,3 1,3 0,10 -1,3 -1,3 -1,1 -1,2 -6,6 -2,1 -1,1 -2,1 -2,1 -2,8 -1,0 2,-8 -3,1 -6,0 -3,-1 2,8 9,0 0,6 -10,0 0,-6 -2,-8 -2,-1 -2,-1 -1,-1 -2,-1 -6,-6 -1,-2 -1,-1 -1,-3 -1,-3 0,-10 1,-3 1,-3 1,-1 1,-2 6,-6 2,-1 1,-1 3,-1 3,-1z”;

Here they are in action, replace the small jet icon with the balloon and the heavy one with the sailplane, you can see what I mean about the upside-down balloon:
https://dl.dropboxusercontent.com/u/50785283/Balloon%20and%20sail.JPG


#13

I think it should be relatively easy to do a marker that doesn’t rotate with a direction arrow overlay that does, or something like that. Will see what I can do there.


#14

Ok, that seems to work:

I also fixed map rotation (shift-alt-drag on desktops) so that the bits that should rotate with the map, do.
Commit to follow.


#15

Wow, you guys don’t mess around!


#16

After last night’s efforts, I am getting my head around curves, this should simplify and improve some of the images (especially the noses of aircraft that are currently a series of straight lines), also seeing what is involved in having multiple paths in one SVG, the balloon was a challenge doing as a single path, had to backtrack to get the basket effect.

A FYI on how I am creating these, I run with three windows, the source image, the SVG code and the output in IE as shown below, I am pretty much doing these by eye and tweak them until they look right, broke my “no integer” rule with the glider though, needed a half move to top it looking too blunt, this is my typical workspace:
https://dl.dropboxusercontent.com/u/50785283/SVGCreation.jpg


#17

I’ve been using Inkscape which is a little fiddly to get set up for this but works OK. You can load up the image in a separate layer to trace over. Pull up the “xml editor” mode to extract the path easily.


#18

I found inkscape the best (i’d found) but far from as concise as IAUCKLAN63’s images. How about a tutorial on how IAUCKLAN63 does it, and we can all get some economic (points) images online?


#19

what software do you use?


#20

Notepad++ and a good eye :smiley:

Coding these on a Windows PC, my main machine is a Mac so I do need to revisit this.

I might look at Inkscape, by “hand coding” these SVGs they come out very light weight and efficient. Don’t want to loose that. A software image tracer results in a far more complex image with little real benefit at the scale we are using them.

I’ll sharpen my process and throw a tutorial together.

Thanks!
Peter.