Programming Pictures with SVGo (original) (raw)

Presentation from SVG Open 2011 on SVGo, a Go Language library for generating SVG. The presentations shows the design of the library, interactive sketching, and making pictures from your own data and data from Internet services

Avatar for Anthony Starks

Transcript

  1. mo@va@on

  2. inspira@on: Processing

generated code Start(w, h int, op@ons ...string) Begin the SVG document, with op@ons Startview(w, h, minx, miny, vw, vh int) Begin the document with a viewport Gid(id string)/Gend() Begin/end a group with an id Gstyle(s string)/Gend() Begin/end a group style Def(s string)/DefEnd() Begin/end defini@on block Title(s string) Specify the document @tle Desc(s string) Specify the document descrip@on Link(href, @tle string)/LinkEnd() Link to content between Link and LinkEnd Use(x, y int, link string, style ...string) Use previously defined content End() End the SVG document 4. ### Lines, Curves, and Path Polyline(x, y []int, s ...string) Line(x1,
y1, x2, y2 int, s ...string) Arc(sx sy, ax, ay, r int, large, sweep bool, ex ey int, s ...string) Bezier(sx, sy, cx, cy, px, py, ex, ey int, s ...string) Path(d string, s ...string) Qbez(sx, sy, cx, cy, ex, ey int, s ...string) 5. ### Textpath(t, pathid string, s ...string) Text(x, y int, t string,
s ...string) Image(x, y, w, h int, link string, s ...string) Textlines(x, y int, s []string, size, spacing int, fill, align string) Text and Image 6. ### Gradients Offset uint8 Color string Opacity float64 Offcolor LinearGradient(id string,
x1, y1, x2, y2 uint8, sc []Offcolor) RadialGradient(id string, cx, cy, r, fx, fy uint8, sc []Offcolor) 7. ### Colors, Grid RGB(r, g, b int) 44 77 232 ⟶
RGBA(r, g, b int, alpha float64) .33 ⟶ 44 77 232 Grid(x, y, w, h, n int, s ...string) 8. ### Arc Circle Line Rect Roundrect Line fill:rgb(164,198,57) Scale 9. ### SVGo Hello world 10. ### using goplay and a browser to sketch with code 11. ### inspec@ng the generated code 12. ### Browser Editor Command lines 13. ### Command lines Visio Editor 14. ### compx: components on a grid 15. ### flickr50 and twiZer update frequency 16. ### tumblrpic 17. ### google webfonts 18. ### layer tennis remixes 19. ### layer Tennis: all of season 3