D3.js债务时钟?

时间:2017-08-28 22:23:49

标签: javascript d3.js

我正在尝试将我的d3.js计时器时钟转换为数字债务时钟。

以下是我尝试复制http://www.usdebtclock.org/

的计数器类型

我没有依赖任何真实数据我只需要从N开始计数然后无限增加。我从现在分叉的代码块有一个实际的时钟计时器,但它不是我需要的,并且我找不到任何好的数值无限计数器。以下是我目前对时钟位的看法:

setInterval(update(), 100); 
  var marginLeft = windowWidht/6;
  var marginTop = windowHeight/3 + windowHeight/2.5;
  var textY = 10;           

  var clockGroup = svg.append("g")
    .attr("transform", "translate("+[marginLeft, marginTop]+")") ;      

  var clockRect = clockGroup.append("rect")
    .attr({
      "width":"70%",
      "height":windowWidht/10,
      "fill":"#C0C0C0",
      "fill-opacity": 0.8
    })

var clockText = clockGroup.append("text")
    .attr({
      "x":"10",
      "y":windowWidht/11,
      "font-size": 110,
      "fill":"#ffffff",
      "stroke":"#000000",
      "stroke-width": 3,
      "font-weight":"bold",
      "font-family":"arial",
      "line-height": 1.5,
      "letter-spacing": 5,
      "word-spacing": 5  
    });

  setInterval(function() {
    clockText.text(moment().format('H:mm:ss:SS'));  
  }, 500)
});
})();

我如何以某种方式调整它,使它看起来像一个债务时钟,而不是像常规时钟? (这是一个更大的代码块的一部分,债务时钟只是一小部分)

0 个答案:

没有答案