Skip to content

Instantly share code, notes, and snippets.

@akselx
Created February 22, 2013 00:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save akselx/5009726 to your computer and use it in GitHub Desktop.
Save akselx/5009726 to your computer and use it in GitHub Desktop.
INFO247 / Lab 5 / #2
{"description":"INFO247 / Lab 5 / #2","endpoint":"","display":"div","public":true,"require":[{"name":"raphael.js","url":"http://poezn.github.com/raphael/raphael.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":15},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":15},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":15}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}
// School of Information, UC Berkeley
// INFO 247 Lab 5: Raphaël.js
// http://blogs.ischool.berkeley.edu/i247s13/lab-5-raphael-js/
// Get the dimensions of the content window. This is something specific to Tributary
// and has nothing to do with Raphaël.js
var contentHeight = tb.sh,
contentWidth = tb.sw;
// HTML element to use for visualization
var contentElement = "display";
// Finally, let's create a "paper": A canvas you can draw on.
var paper = Raphael(contentElement, contentWidth, contentHeight);
// ===========================================================
// START DRAWING HERE
var y = 29,
radius = 20;
for (var i = 0; i < 10; i++) {
// draw each circle 50 pixels away from the previous one
var x = 152 + i * 75;
var y = 44 + i * 27;
var opac = i * .1;
var circle = paper.circle(x, y, radius)
var size = i*10
// style this circle
var attributes = {
"fill": “r#fff-#000”,
"stroke": "#C0C0C0",
"stroke-width": 4,
"fill-opacity":opac,
};
circle.attr(attributes);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment