Parameterized Lines

The Parameterized Lines sample illustrates how to flexibly style and filter polylines via a dedicated painter. Any attribute can be used to thematically style the data. All calculations are performed client-side and use WebGL.

The sample shows a dataset of flight to and from New York.
Each flight has a couple of properties:

• Id : its callsign
• Class : the class of aircraft, for example Turboprop
• Type : the aircraft type, for example Airbus A320

Each flight also has properties at each point on its line, representing the state of the aircraft at that time:

• Heading : the direction (azimuth)
• Speed : the speed over ground
• Climb rate : the vertical speed
• Fuel burn : the fuel consumption

The buttons allow you to choose different visualization styles.

• Fuel burn shows a gradient along each flight, where higher fuel consumption is in red
• Climb rate shows a gradient along each flight, where steep descent is in blue and steep ascent in red
• Class colors each flight according the class of aircraft

For each mode, you tweak the visualization using the UI.
Also for each mode can enable density painting.

See ParameterizedLinePainter for details on how to use this kind of styling.

• Use rangeColorMap change color along each line based on a property
• Use rangeWindow to filter out parts of each line
• Use propertyColorExpressions to color whole lines based on properties
• Use FeaturePainter.density to enable density