To eliminate the need for two world files per level (for layering effect track.svg and track-bridges.svg are placed below and above the player car), the app should make separate sprites out of the various layers inside the track.svg file, so a single level/track contains all the necessary information.
Stacked from the bottom, each track file would have layers something like this:
world scenery
racetrack path (including start/finish line / sector blocks)
bridges / tunnels / ad boards (stuff a player can drive underneath)
clouds / birds ?
Suggested approach
lmao no, see comment below
iterate top-level <svg:g inkscape:label=""> elements
set all to style="display:none" except selected layer
create Image object per selected layer, assign image to new Sprite object
re-assemble sprites into working game world
srsly: load each track.svg#layer into a Sprite object (on/off track detection, timing sectors could be added later)
Good side effect
The game would then only use the racetrack path sprite to do logic / calculations on (perhaps this sprite can even be scaled down for performance reasons) before merging all sprites including the car together onto the <canvas>
Ok I absolutely just learned about svg-stacks just by adding the tag svg and this came up under #svg-sprites. Potentially makes things a lot easier. Support is :fire: chefs kiss :fire:
To eliminate the need for two world files per level (for layering effect
track.svg
andtrack-bridges.svg
are placed below and above the player car), the app should make separate sprites out of the various layers inside thetrack.svg
file, so a single level/track contains all the necessary information.Stacked from the bottom, each track file would have layers something like this:
Suggested approach
lmao no, see comment below
iterate top-level<svg:g inkscape:label="">
elementsset all tostyle="display:none"
except selected layercreate Image object per selected layer, assign image to new Sprite objectre-assemble sprites into working game worldsrsly: load each track.svg#layer into a Sprite object (on/off track detection, timing sectors could be added later)
Good side effect
The game would then only use the racetrack path sprite to do logic / calculations on (perhaps this sprite can even be scaled down for performance reasons) before merging all sprites including the car together onto the
<canvas>