我的服务器端模型以UTC格式保存日期/时间。 在我的前端,我使用moment.js使用服务器端数据创建时间对象。
但是,我使用d3绘制数据,我不太确定如何使用我的时刻对象初始化d3.scale.utc()
。我需要以UTC时间渲染轴刻度。
以前,d3.scale.utc().domain(starDate, endDate)
工作的地方startDate
和endDate
是本机JavaScript日期对象。
但是现在我已经重构了代码以使用moment.js来处理UTC时间并简化了一些日期和时间操作功能,我正面临着这个密谋问题。
答案 0 :(得分:4)
你有一个时刻对象,你想将它提供给d3
?最简单的方法是使用通过valueOf()获得的JavaScript纪元时间:
var startDate = moment().subtract(10, 'hours').utc();
var endDate = moment().add(10, 'hours').utc();
var x = d3.time.scale.utc()
.domain([startDate.valueOf(), endDate.valueOf()])
.range([0, 400]);
var xAxis = d3.svg.axis()
.scale(x);
var svg = d3.select("body").append("svg")
.attr("width", 410)
.attr("height", 210)
.append("g")
.attr("transform", "translate(" + 10 + "," + 10+ ")");
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + 0 + ")")
.call(xAxis)
.selectAll("text")
.attr("y", 0)
.attr("x", 9)
.attr("dy", ".35em")
.attr("transform", "rotate(90)")
.style("text-anchor", "start");
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.1/moment.js"></script>