Changes

Jump to: navigation, search

Canvas SVG Parser

1,204 bytes added, 10:55, 23 February 2014
m
add a more trivial example that doesn't have additional dependencies or requires more knowledge
<!-- Integration-wise, there are some lessons to be learnt from the way SMIL works via SVG and ECMAScript (JavaScript). -->
 
== Hello World ==
 
[[File:Svgpre.png|thumb|Demonstrate how to preview SVG Images using Canvas]]
 
Paste this into your [[Nasal Console]] and click run:
<syntaxhighlight lang="nasal">
var CanvasApplication = {
##
# constructor
new: func(x=300,y=200,file="/gui/dialogs/images/ndb_symbol.svg") {
 
var m = { parents: [CanvasApplication] };
m.file=file;
m.dlg = canvas.Window.new([x,y],"dialog");
# you can change the background color here
var color = {WHITE:[1,1,1,1],BLACK:[0,0,0,1]};
m.canvas = m.dlg.createCanvas().setColorBackground(color.BLACK);
m.root = m.canvas.createGroup();
m.update();
return m;
},
update: func() {
var svg_symbols = me.root.createChild("group", "navaid");
canvas.parsesvg(svg_symbols, me.file);
svg_symbols.setScale(0.35); # resize the image so that it can be fully seen (35%)
 
 
},
init: func() {
var filename = "/Aircraft/Instruments/gyro.xml";
}, # init
}; # end of CanvasApplication
var SVGMapPreview= {
new: func(x,y,svg) {
var m = CanvasApplication.new(x:x, y:y, file:svg);
return m;
},
};
var preview= SVGMapPreview.new(x:400, y:400, svg:"Nasal/canvas/map/boeingND.svg");
print("SVGPreviewer loaded ...!");
</syntaxhighlight>
== Basic example ==
18,574
edits

Navigation menu