Lissajous Curve

_.md

[ Launch: Lissajous Curve ] 28b97b58936b3f74dca7 by MonsieurCactus
[ Launch: test ] 4653053 by enjalot
[ Launch: test ] 4652017 by enjalot
[ Launch: test ] 4582399 by enjalot

config.json

{"description":"Lissajous Curve","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"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,"tab":"edit","display_percent":0.7,"thumbnail":"http://i.imgur.com/Z4ghHZY.png","fullscreen":false,"ajax-caching":true}

inlet.js

var svg = d3.select("svg")

svg.append("rect")
.attr({
  width: 210,
  height: 210,
  x: 20,
  y: 20,
  fill: "#e4d9a4"
});

//The data for our line
var lineData = Array();

var pi = 3.14159;

for(var i=0; i < 1000; i++){
	lineData.push({"x": 100*Math.cos(3*2*pi*i/180)+125, "y":100*Math.sin(5*2*pi*i/180) +125  } );
 } 

//This is the accessor function we talked about above
var lineFunction = d3.svg.line()
                         .x(function(d) { return d.x; })
                         .y(function(d) { return d.y; })
                         .interpolate("linear");

//The SVG Container
var svgContainer = d3.select("svg");

//The line SVG Path we draw8
var lineGraph = svgContainer.append("path")
                            .attr("d", lineFunction(lineData))
                            .attr("stroke", "#7A6BED")
                            .attr("stroke-width", 2)
                            .attr("fill", "none");