20,741
edits
Howto:Serializing a Canvas to SVG: Difference between revisions
Jump to navigation
Jump to search
m
Howto:Serializing a Canvas to SVG (view source)
Revision as of 10:32, 30 October 2016
, 30 October 2016→Test Canvas
m (→Test Canvas) |
|||
| Line 203: | Line 203: | ||
<syntaxhighlight lang="nasal"> | <syntaxhighlight lang="nasal"> | ||
var (width,height) = (320,160); | |||
var title = 'Canvas2SVG Serialization demo'; | |||
var window = canvas.Window.new([width,height],"dialog").set('title',title); | |||
var myCanvas = window.createCanvas().set("background", canvas.style.getColor("bg_color")); | |||
var root = myCanvas.createGroup(); | |||
# create an image child for the texture | |||
var img = root.createChild("image") | |||
.setFile("Textures/Splash1.png") # path is relative to $FG_ROOT (base package) | |||
.setTranslation(180, 10) | |||
.setSize(65,65); | |||
var graph = root.createChild("group"); | |||
var x_axis = graph.createChild("path", "x-axis") | |||
.moveTo(10, height/2) | |||
.lineTo(width-10, height/2) | |||
.setColor(1,0,0) | |||
.setStrokeLineWidth(3); | |||
var y_axis = graph.createChild("path", "y-axis") | |||
.moveTo(10, 10) | |||
.lineTo(10, height-10) | |||
.setColor(0,0,1) | |||
.setStrokeLineWidth(2); | |||
var myText = root.createChild("text") | |||
.setText("Hello world!") | |||
.setFontSize(16, 0.9) # font size (in texels) and font aspect ratio | |||
.setColor(1,0,0,1) # red, fully opaque | |||
.setAlignment("center-center") # how the text is aligned to where you place it | |||
.setTranslation(160, 130); # where to place the text | |||
</syntaxhighlight> | </syntaxhighlight> | ||