d3.js两个日期之间的天数

我想用图表表示开始日期和结束日期之间的距离。我使用x位置作为开始日期，我需要矩形的宽度为开始和结束之间的天数。（我想）

以这种方式显示数据并没有达到预期效果：我需要在结束日期结束宽度，但看起来比例扭曲了东西。谢谢

var w = 925;
var h = 400;
var padding = 50;

var interactiveViz = d3.select("#viz").append("svg")
    .attr("width", w)
    .attr("height", h);

var minDate = new Date(1999, 1, 27),
    maxDate = new Date(2013, 10, 9);    

var xscale = d3.time.scale()
    .domain([minDate, maxDate])
    .range([0,w]);

var xaxis = d3.svg.axis()
    .scale(xscale)
    .tickFormat(d3.time.format('%Y'))   
    .tickValues([minDate, maxDate]);

interactiveViz.selectAll("rect")
    .data(myData)
    .enter()
    .append("rect")
    .attr("x", function(d) { return xscale(new Date(d.start)) })
    .attr("y", function(d,i) { return i*15 })
    .attr("height", "14px")
    .attr("width", function(d) { return xscale(new Date(d.end)) });

interactiveViz.append("g")
    .attr("class", "x-axis")
    .attr("transform", "translate(0,"+(h-padding)+")")
    .call(xaxis)
    .selectAll("text") 
    .attr("y", "10px")
    .style("fill", "#999999");  

数据：

---

您希望宽度等于开始日期和结束日期之间的像素数

开始日期的像素位置为：

xscale(new Date(d.start))

结束日期的像素位置为：

xscale(new Date(d.end))

它们之间的像素数为

xscale(new Date(d.end)) - xscale(new Date(d.start))

宽度应该等于哪个

.attr("width", function(d) { return xscale(new Date(d.end)) - xscale(new Date(d.start)) });

---

谢谢你澄清这一点。看起来你在最后两行中重复了两次d.end而不是d.end-d.startfixed，这是一个打字错误，谢谢。您可能希望一次性将日期转换为字符串，这将使以后的代码更短。

.attr("width", function(d) { return xscale(new Date(d.end)) - xscale(new Date(d.start)) });