Skip to content




adjust phase:

var lineFunction = d3.svg.line()
.x(function (d) {
return x(d.x);
.y(function (d) {
return y(d.y);

var width = 600;
var height = 600;

var x = d3.scale.linear()
.domain([-1, 1])
.range([0, width]);

var y = d3.scale.linear()
.domain([-1, 1])
.range([height, 0]);

var t = 0;
var point = {
x: 0,
y: 0

//Create SVG element
var svg =“#lissijous”)
.attr(“width”, width)
.attr(“height”, height);

var epsilon = 0.1;

function drawNewPoint(tx, ty, point) {
oldpoint = {
x: point.x,
y: point.y
}; // need copy of old point for drawing line
var xfreq = 1 * $(“#xFrequency”).val();
var yfreq = 1 * $(“#yFrequency”).val();
point.x = Math.sin(tx);
point.y = Math.sin(ty + yfreq * $(“#phaseDifference”).val());

setTimeout(function () {
drawNewPoint(tx += epsilon * xfreq, ty += epsilon * yfreq, point);
}, 0.1);

.attr(“d”, lineFunction([oldpoint, point]))

.attr(“stroke”, “red”)
.attr(“stroke-width”, 2)
.attr(“fill”, “none”)
.transition().duration(8000).style(“opacity”, 0).remove();

.attr(“cx”, x(point.x))
.attr(“cy”, y(point.y))
.attr(“r”, 2)
.transition().duration(8000).style(“opacity”, 0).remove();

drawNewPoint(0, 0, point);


Hello world!

Welcome to After you read this, you should delete and write your own post, with a new title above. Or hit Add New on the left (of the admin dashboard) to start a fresh post.

Here are some suggestions for your first post.

  1. You can find new ideas for what to blog about by reading the Daily Post.
  2. Add PressThis to your browser. It creates a new blog post for you about any interesting  page you read on the web.
  3. Make some changes to this page, and then hit preview on the right. You can always preview any post or edit it before you share it to the world.