Simple Ellipsoid Gravity

<!DOCTYPE html>
<meta charset="utf-8">
<style>

path {
  stroke: #000;
  stroke-width: .5px;
}

circle {
  fill: none;
  stroke: #000;
  stroke-width: 2px;
}

</style>
<body>
<script src="https://d3js.org/d3.v2.min.js?2.9.6"></script>
<script src="geodesic.js"></script>
<script>

var width = 960,
    height = 500;

var origin = [0, 0],
    velocity = [.010, .005],
    t0 = Date.now();

var projection = d3.geo.azimuthal()
    .mode("orthographic")
    .origin(origin)
    .scale(240);

var path = d3.geo.path()
    .projection(projection);

var arc = d3.geo.greatArc()
    .source(origin)
    .target(function(d) { return d; });

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

svg.selectAll("path")
    .data(d3.geodesic.polygons(8))
  .enter().append("path")
    .style("fill", function(d) { return d3.hsl(d.coordinates[0][0][0], .7, .5); });

svg.append("circle")
    .attr("transform", "translate(" + projection(origin) + ")")
    .attr("r", 240);

d3.timer(function() {
  var t = Date.now() - t0,
      o = [origin[0] + t * velocity[0], origin[1] + t * velocity[1]];
  projection.origin(o);
  arc.source(o);
  svg.selectAll("path").attr("d", function(d) { return visible(d) ? path(d) : null; });
});

function visible(d) {
  return d.coordinates[0].some(function(p) {
    return arc.distance(p) < Math.PI / 2;
  });
}

</script>

Modified http://d3js.org/d3.v2.min.js?2.9.6 to a secure url

https://d3js.org/d3.v2.min.js?2.9.6