Skip to content

Instantly share code, notes, and snippets.

@cbellei

cbellei/_.md

Created December 27, 2013 08:15
Show Gist options
  • Save cbellei/8144040 to your computer and use it in GitHub Desktop.
Save cbellei/8144040 to your computer and use it in GitHub Desktop.
Download ZIP
2D Random Walk
Raw
_.md
Raw
config.json
{"description":"2D Random Walk","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}},"fullscreen":false,"play":false,"loop":false,"restart":true,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/yrqNVhJ.png"}
Raw
inlet.js
function initx(x0,npart){ //initialization position in x
var ra = [];
for(var i=0; i<npart; i++){
ra[i] = x0;
}
return ra;
}
function inity(y0,npart){ //initialization position in y
var ra = [];
for(var i=0; i<npart; i++){
ra[i] = y0;
}
return ra;
}
function random_path(xstart,npart){ //moves particles left or right with uniform distribution
var ra = [];
for(var i=0; i<npart; i++){
L = 30.0; //size of uniform distribution function
ra[i] = xstart[i] + (Math.random()*L - L/2.0); //updates position of particle
}
return ra;
}
function radius(xstart,ystart,x0,y0,npart){ //calculates radial position of particle
var r = [];
for(var i=0; i<npart; i++){
r[i] = Math.sqrt( Math.pow(xstart[i]-x0[i],2) + Math.pow(ystart[i]-y0[i],2) ); //calculates radius of particle
}
return r;
}
//---- USER DEFINED PARAMETERS -----
var x0 = 260;
var y0 = 270;
var npart = 400; //number of particles to use
//----------------------------------
var x0v = initx(x0,npart) //vector initialization
var y0v = inity(y0,npart) //vector initialization
var width = 1000;
var height = 1000;
var svg = d3.select("svg")
.attr("width",width)
.attr("height",height)
.append("g")
.attr("transform","translate(20,0)");
var elementRoot = svg.selectAll("g")
.data(x0v.map(function(x) {return x ;} ))
.enter()
.append("g")
function create_circles(svg,xstart,ystart) {
var r = radius(xstart,ystart,x0v,y0v,npart); //calculates radial position of particle
var dt = 2000;
var color = d3.scale.category10();
var elementRoot = svg.selectAll("g")
.data(xstart.map(function(x) {return x ;} ))
.append("g")
.append("circle")
.attr("cx", function(d) {return d;})
.attr("cy", function(d,i) {return ystart[i];})
.attr("r",6)
.attr("fill", function(d,i) {return color(r[i]); })
.attr("stroke","none")
.style("fill-opacity", "1.0")
.transition()
.delay( function(d,i) {return 10;})
.duration(dt)
.remove()
var xvec = random_path(xstart,npart); //updates particle's position in x
var yvec = random_path(ystart,npart); //updates particle's position in y
setTimeout(function() {create_circles(svg,xvec,yvec)},dt )
}
create_circles(svg,x0v,y0v)
var L = 100;
svg.append("line")
.attr("x1",x0-L)
.attr("y1",y0)
.attr("x2",x0+L)
.attr("y2",y0)
.attr("stroke","black")
.attr("stroke-width",1)
.style("opacity",0.5)
.style("stroke-dasharray", ("4, 5"));
svg.append("line")
.attr("x1",x0)
.attr("y1",y0-L)
.attr("x2",x0)
.attr("y2",y0+L)
.attr("stroke","black")
.attr("stroke-width",1)
.style("opacity",0.5)
.style("stroke-dasharray", ("4, 5"));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment