Learning Objectives

Students will be able to:

Understand essential differences between raster and vector graphics.
Consider relationship between form and meaning.
Explore advantages of exporting vector data from a procedural generator.
Introduce Paper.js
Introduce PaperScript
Understand retained mode and immediate mode graphics

Preparation

Read the Vector chapter.
Complete the coding challenges.
Add two questions related to the chapter or challenges below.

Time	Duration	Purpose	Format	Name
9:00	40	Activate	Discussion	Sketch Review
	20	Engage	Activity	Code Comment Challenge
	10	Study	Lecture	Immediate vs Retained Mode
	20	Study	Lecture	PaperScript vs JavaScript
	10			Break
	10	Study	Live-Code	Q+A
	60	Activate	Activity	Group Code Challenge
	10	Study	Lecture	Next Week

Questions and Answers

<aside> 🧟 Add your two questions below, include your name!

</aside>

Lauria

Last semester, I could never figure out how to have a linebreak in Paper.js text preserved when I download as .svg and import elsewhere. I tried all the linebreak encodings I could think of and also messing with the svg directly. Any thoughts?

to see the issue you can click download from my generator
text is implemented on line 407 here

hmm, without doing any looking into this at all... if the svg export is eating \\n newlines, i'd first open up the svg in an editor, and put one in manually and the open that in a vector program like illustrator. This step would determine if there is some limitation with svg or if it is a problem with paper's export. If the latter maybe you could try a unicode sequence?

<https://www.loginradius.com/blog/async/eol-end-of-line-or-newline-characters/#:~:text=LF%20>(character%20%3A%20%5Cn%2C,'%20or%20'Newline%20Character'.

a super hack, but you could try putting in a custom control character like "^" exporting the svg, and then post processing to turn them into newlines.