动画D3地球仪(d3.geo.azimuthal)

时间:2012-10-07 13:04:22

标签: animation d3.js

我对d3 javascript图书馆有疑问。我想使用azimuthal地球仪,我希望从地球上的经度和弧度坐标插入点,并在不使用鼠标事件的情况下对地球进行动画处理。

你认为这是可能的吗?你能给我一些关于如何做到这一点的好建议吗?

干杯 托尔

1 个答案:

答案 0 :(得分:5)

为了使示例自行旋转,我实现了:

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();
      }
    }
  }

我正在努力为地图添加点,这要复杂得多。如果我不能让它工作,我会在这里回复。