Animating D3 globe (d3.geo.azimuthal)

问题:

I have question about the d3 javascript libarary. I want to use the azimuthal globe and I want to insert points from longitude and lattitude coordinates on the globe and make the globe be animated without ever using the mouse events.

Do you think this is possible? Can you give me some good tips on how to do this?

Cheers Thor

回答1:

To make the example rotate on its own I implemented:

var newX = 185;
var newY = -200;

function setupRotate() {
    m0= [0,0];
    o0 = projection.origin();
  }

  function rotate() { 
    if (m0) {
      var m1 = [newX, newY];//d3.event.pageX, d3.event.pageY],
          o1 = [o0[0] + (m0[0] - m1[0]) / 8, o0[1] + (m1[1] - m0[1]) / 8];
      projection.origin(o1);
      //console.log(m1);
      circle.origin(o1)
      refresh();
      //console.log("rotate");
      //console.log("newX: "+newX+"  newY: "+newY);
    }
  }

function rotateInterval() {
    var theRotationInterval = setInterval(rotateAndIncrement,1);
    function rotateAndIncrement(){
      //console.log("rotateAndIncrement");
      if (newX === 3)//3065) {
      {
       //console.warn("!!Reset Rotation!!");
       clearInterval(theRotationInterval);
       newX = 185;
       rotateInterval();
      }
      //console.log("newX: "+newX+"  newY: "+newY);
      else {
        newX++;
        rotate();
      }
    }
  }

I'm working on adding points to the map, it's much more complicated. If I cant get it working I'll post back here.