20,741
edits
Canvas Map API: Difference between revisions
Jump to navigation
Jump to search
→Adding support for new Layer Types
| Line 53: | Line 53: | ||
* A new class (Nasal hash) that derives from the "Layer" class and implements its interface | * A new class (Nasal hash) that derives from the "Layer" class and implements its interface | ||
* A "data source" (provide) hash that provides the data to be rendered | * A "data source" (provide) hash that provides the data to be rendered | ||
The callbacks to draw a particular layer element are to be found in $FG_ROOT/Nasal/canvas/map, at the moment, we have these modules (listed in ascending complexity): | |||
* Nasal/canvas/map/tower.draw | |||
* Nasal/canvas/map/navaid.draw | |||
* Nasal/canvas/map/parking.draw | |||
* Nasal/canvas/map/runways.draw | |||
* Nasal/canvas/map/taxiways.draw | |||
Each "*.draw" file contains a single Nasal function, named "draw_FOO" - where FOO is simply chosen based on what is drawn, so you can make up your own name, like "draw_route" for example. | |||
When implementing support for new routines, it is recommended to take an existing files, such as the tower.draw or navaid.draw files and just copy/paste and customize things as needed. | |||
This is what the tower.draw file looks like: | |||
<syntaxhighlight lang="php"> | |||
var draw_tower = func (group, apt,lod) { | |||
var group = group.createChild("group", "tower"); | |||
# TODO: move to map_elements.nas (tower, runway, parking etc) | |||
# i.e.: set_element(group, "tower", "style"); | |||
var icon_tower = | |||
group.createChild("path", "tower") | |||
.setStrokeLineWidth(1) | |||
.setScale(1.5) | |||
.setColor(0.2,0.2,1.0) | |||
.moveTo(-3, 0) | |||
.vert(-10) | |||
.line(-3, -10) | |||
.horiz(12) | |||
.line(-3, 10) | |||
.vert(10); | |||
icon_tower.setGeoPosition(apt.lat, apt.lon); | |||
} | |||
</syntaxhighlight> | |||
As you can see, the draw* callback takes three arguments: | |||
* the canvas group/layer to be used | |||
* the layer-specific "model" information (airport/apt in this case) | |||
* an LOD argument (currently not yet used). | |||
The airport.draw file demonstrates how to create paths procedurally. But you can just as well load the vector image from an SVG file. For an example, please refer to navaid.draw, which is shown below: | |||
<syntaxhighlight lang="php"> | |||
var draw_navaid = func (group, navaid, lod) { | |||
#var group = group.createChild("group", "navaid"); | |||
var symbols = {NDB:"/gui/dialogs/images/ndb_symbol.svg"}; # TODO: add more navaid symbols here | |||
if (symbols[navaid.type] == nil) return print("Missing svg image for navaid:", navaid.type); | |||
var symbol_navaid = group.createChild("group", "navaid"); | |||
canvas.parsesvg(symbol_navaid, symbols[navaid.type]); | |||
symbol_navaid.setGeoPosition(navaid.lat, navaid.lon); | |||
} | |||
</syntaxhighlight> | |||