20,741
edits
Howto:Dynamic Liveries via Canvas: Difference between revisions
Howto:Dynamic Liveries via Canvas (view source)
Revision as of 21:00, 17 September 2014
, 17 September 2014no edit summary
mNo edit summary |
|||
| Line 1: | Line 1: | ||
== Objective == | == Objective == | ||
Demonstrate how to modify/animate liveries using Nasal/Canvas. | Demonstrate how to modify/animate liveries using Nasal/Canvas. | ||
== Example == | |||
== Proof of Concept == | |||
''by [[User:Algernon|Algernon]] ([[User talk:Algernon|talk]]) 17:09, 17 September 2014 (UTC) '' | |||
To document the implementation on a FlightGear aircraft from the aircraft developer's point of view, I've chosen one of my pet projects, the Eurofighter EF2000 V2.0 which will be released in early 2015. | |||
The intention is to use Canvas to allow multiple textures per livery, in this case those textures being the original livery paintwork and another, alpha-transparent texture consisting of dirt streaks specifically added to the livery paintwork to match with vents, seams and other sources of grimy build-ups. The intention is to allow dynamic management of the transparency of the dirt layer according to time and exposure to various elements, maintaining compatibility with the standard livery switching method and working similarly whether Rembrandt is enabled or not. | |||
<gallery mode=packed> | |||
Two-layers.jpg|The two textures concerned, the ASG paintwork and the separate alpha transparency with dirt streaks | |||
Dynamic-Textures-First-Try.jpg|A first (failed) attempt to put a canvas onto a model object in place of its texture. | |||
Ef2000dyn1.jpg|325px|The EF2000 showing a dynamically-changed texture on the fuselage - at the moment, the resolution appears to be wrong and the UV coordinates seem to be being ignored. | |||
</gallery> | |||
''This section will be updated as the implementation continues.'' | |||
=== Model Work === | |||
To start with, I cloned the EF2000's model and made a copy called "EF2000-canvas.ac", cloned the model XML file in the same way, and changed the paths appropriately to create a completely separate model for this experiment. The model objects which will be subject to the dynamic effects - effectively, the painted surfaces - were isolated from items like the canopy glass, gear and engines and given the same material, named '''CanvasPaint''' and consisting of an image texture: a livery in Air Superiority Grey but without the dirt layer already included. My first experiment will be to create a canvas and try to apply it to the mesh. | |||
{{-}} | |||
=== Canvas Code === | |||
From the code snippets above and [[Howto:Using_raster_images_and_nested_canvases]], I've put together my first attempt at some Canvas code. It appears that the canvas is the right size, and both .jpg and .png textures are loaded. But the placement line did not seem to make any difference to the texture on the named model object ("Fuselage"). When the native XML/Nasal livery object was commented out, the image was successfully displayed on the fuselage, but incorrectly sized and apparently without UV mapping (see image below). | |||
<syntaxhighlight lang="nasal"> | |||
# Create a Canvas dialog window to hold the canvas and show that it's working | |||
var window = canvas.Window.new([512,512],"dialog"); | |||
# Create a Canvas in the window and create a containing group called root | |||
var myCanvas = window.createCanvas(); | |||
var root = myCanvas.createGroup(); | |||
# Add a placement by replacing the textured face "Fuselage" in the 3D model | |||
myCanvas.addPlacement({"node": "Fuselage"}); | |||
# Put a raster image into the canvas | |||
root.createChild("image") | |||
.setFile("Aircraft/EF2000/Models/EF2000.png") | |||
.setSize(2048,2048); | |||
</syntaxhighlight> | |||
== Original Example == | |||
{{Note|This assumes that you're using the ogel aircraft and that the face texture can be looked up using the name '''Head'''. | {{Note|This assumes that you're using the ogel aircraft and that the face texture can be looked up using the name '''Head'''. | ||
The map shown here is just an example, this could obviously be anything, including raster/svg images, custom OpenVG/ShivaVG paths, osgText etc. | The map shown here is just an example, this could obviously be anything, including raster/svg images, custom OpenVG/ShivaVG paths, osgText etc. | ||
| Line 10: | Line 54: | ||
In its current form, this will simply apply the texture mapping used in the 3D mode "as is". In other words, all texture-mapped faces should be accessible from Nasal/Canvas and can be modified/animated. | In its current form, this will simply apply the texture mapping used in the 3D mode "as is". In other words, all texture-mapped faces should be accessible from Nasal/Canvas and can be modified/animated. | ||
In comparison to a pure shader-based approach this is likely to have a little more overhead, while not requiring effects/shaders (but RTT/FBOs due to Canvas) - also, this approach is agnostic to the underlying rendering pipeline, i.e. should also work for Rembrandt aircraft, without having to be customized. }} | In comparison to a pure shader-based approach this is likely to have a little more overhead, while not requiring effects/shaders (but RTT/FBOs due to Canvas) - also, this approach is agnostic to the underlying rendering pipeline, i.e. should also work for Rembrandt aircraft, without having to be customized. }} | ||
[[File:Canvas-livery-demo-using-ogle.png|left|400px|A screen shot showing the ogel aircraft whose livery is dynamically changed using the [[Canvas]] system - in this case, we're simply rendering a [[MapStructure]] map onto the face of the pilot using ~10 lines of Nasal/Canvas code.]] | |||
<syntaxhighlight lang="nasal"> | <syntaxhighlight lang="nasal"> | ||
| Line 150: | Line 197: | ||
}} | }} | ||
}} | }} | ||