tinygraphs

tinygraphs is an avatar generator web service. Checkout tinygraphs.com to try it.

Contributors

• Santiago
• Remy
• Carmen

Blog post:

Building tinygraphs an avatar web service in Go

How to use:

• You can set the HTML source of the image to point directly to tinygraphs.com

<img src="http://tinygraphs.com/squares/helloworld">

• You can save the image and use it directly on your site
• You can go get this repo and use it.

just remember to give us credit with a link to tinygraphs.com ;)

Supported routes:

http://tinygraphs.com/squares/anything

http://tinygraphs.com/isogrids/helloworld

http://tinygraphs.com/spaceinvaders/helloworld

http://tinygraphs.com/squares/banner/random?h=50&xs=100

http://tinygraphs.com/squares/banner/random/gradient?theme=frogideas&xs=100

http://tinygraphs.com/isogrids/banner/random?h=50&xt=100

http://tinygraphs.com/isogrids/banner/random/gradient?theme=frogideas&h=50&xt=100

##Lab routes:

http://tinygraphs.com/labs/checkerboard

http://tinygraphs.com/labs/squares/random

http://tinygraphs.com/labs/isogrids/random

http://tinygraphs.com/labs/isogrids/hexa

http://tinygraphs.com/labs/isogrids/hexa16

http://tinygraphs.com/labs/squares/banner/gradient

http://tinygraphs.com/labs/isogrids/banner/gradient

Parameters:

• size: tinygraphs.com/squares/hello?size=60

• formats: tinygraphs.com/squares/hello?fmt=svg

  The default format is SVG.

  All routes support SVG format, except Square routes who also support JPEG.

• background and foreground: tinygraphs.com/squares/hello?bg=ff4008&fg=04d6f2

  You can specify the color of the background or foreground by using parameters bg and fg and passing an hexadecimal value of the color:

• theme: tinygraphs.com/labs/squares/random?theme=frogideas

  You can specify the theme you want to take into account in the image.

  

  Here is the list of existing themes:

  • base
  • sugarsweets
  • heatwave
  • daisygarden
  • seascape
  • summerwarmth
  • bythepool
  • duskfalling
  • frogideas
  • berrypie

• numcolors: tinygraphs.com/labs/squares/random?theme=summerwarmth&numcolors=4

  You can specify the number of colors that you want to render the image. Default value is 2 and can be extended to 4.

  

• inv: tinygraphs.com/squares/hello?theme=frogideas&numcolors=2&inv=1

  You can specify if you want to see the colors inverted. Default value is false. inv parameter works with theme colors or default (black and white) colors. The number of colors has to be equal to 2.

  

• order: tinygraphs.com/squares/hello?theme=frogideas&numcolors=4&order=3&order=2&order=1&order=0

  You can specify the order in which you want to see the colors by using the order parameter. Just add the indexes in which you wish to see the colors to the order array (indexes are zero based) Like so: order=3&order=2&order=1&order=0

  

• lines: tinygraphs.com/isogrids/hello?lines=4

You can specify the number of lines that an isogrid can have using the linesparameter. Default parameter is 6. Value has to be greater or equal to 4.

• colors:

tinygraphs.com/isogrids/hello?lines=4&colors=43e0e8&colors=e84b43 You can specify use you own colors by using the colors parameter and passing hexa colors.

![isogrid with custom colors](http://tinygraphs.com/isogrids/hello?lines=4&size=120&colors=43e0e8&colors=e84b43)

• banner parameters:

  • h: height parameter.
  • w: width parameter.
  • xt: number of triangles in isogrid banner in x axis.
  • xs: number of squares in squares banner in x axis.
  • theme: tinygraphs theme to use in banner.
  • numcolors: number of colors to take into account when rendering banner.

  tinygraphs.com/isogrids/banner/random/gradient?theme=bythepool&numcolors=4

• random banner parameters:

  • p: probability of the main color in the banner. Default value is 0.5. Values should be between 0 and 1

  tinygraphs.com/labs/isogrids/banner/gradient?theme=bythepool&p=0.1

  

• isogrid color gradient parameters

  You can manipulate the gradient vector using the following parameter.

  • gx1: first gradient coordinate along x axis.
  • gy1: first gradient coordinate along y axis.
  • gx2: second gradient coordinate along x axis.
  • gy2: second gradient coordinate along y axis.

  tinygraphs.com/labs/isogrids/banner/gradient?theme=bythepool&xt=4&h=120&w=120&gx1=0&gy1=0&gy2=60&gx2=60

  

Stack

• Go
• Heroku

Third parties

• Bootstrap
• AngularJS
• route
• svgo

Installation

go get github.com/taironas/tinygraphs
cd $GOPATH/src/github.com/taironas/tinygraphs
glide install
go build
export PORT=8080

Run App

> pwd
$GOPATH/src/github.com/taironas/tinygraphs
> tinygraphs
2014/11/19 22:23:57 Listening on 8080

Build

>cd $GOPATH/src/github.com/tinygraphs
>go build

Test locally

option 1:

> tinygraphs
2014/12/07 00:35:02 Listening on 8080

option 2:

If you have heroku install you should be able to run

> heroku local
00:37:38 web.1  | started with pid 5762
00:37:38 web.1  | 2014/12/07 00:37:38 Listening on 8080

option 3:

> go test ./...

Deploy

Easy

Manual

Note: heroku is now configured to build and deploy any git pushto master. If you still want to manual deploy the app follow the steps below.

Before you start be sure to have the proper rsa key. See Managing Your SSH Keys for more details and that. Also be sure to be logged in with heroku.

> heroku login
Enter your Heroku credentials.
Email: ga@tinygraphs.com
Password:

After that you can deploy as follows:

> git push heroku master
Fetching repository, done.
Counting objects: 5, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 287 bytes | 0 bytes/s, done.
Total 3 (delta 2), reused 0 (delta 0)

-----> Fetching custom git buildpack... done
-----> Go app detected
-----> Using go1.3
-----> Running: go get -tags heroku ./...
-----> Discovering process types
       Procfile declares types -> web

-----> Compressing... done, 1.5MB
-----> Launching... done, v6
       https://tinygraphs.herokuapp.com/ deployed to Heroku

To git@heroku.com:tinygraphs.git
   56a3000..5572085  master -> master