Datetime d3.js日期时间：小时未在y轴上正确显示

使用d3.js v4，我试图在y轴上绘制时间图。y轴表示时钟的24小时

数据很简单

[{
    "start": "2016-11-14 20:00",
    "end": "2016-11-14 23:59"
  },
  {
    "start": "2016-11-16 01:00",
    "end": "2016-11-16 03:00"
  },
  {
    "start": "2016-11-15 00:00",
    "end": "2016-11-15 04:00"
  }
]

第一个对象应该是从20到24的图形，但它是从19到23的。这可能会导致一个问题，例如基于零的计数

有人对我如何解决这个问题有什么建议吗

这是完整的代码片段

d3日期时间图 -> var svg=d3.selectsvg， 保证金={ 前20名， 右：60， 底数：60， 左：40 }, 宽度=+svg.attrwidth-margin.left-margin.right， 高度=+svg.attrheight-margin.top-margin.bottom； 变量颜色=[2C93E8、838690、F56C4E、A60F2B、648C85、B3F2C9、528C18、C3F25C]； 风险值数据=[{ 开始时间：2016-11-14 20:00， 完：2016-11-14 23:59 }, { 开始时间：2016-11-16 01:00， 完：2016-11-16 03:00 }, { 开始时间：2016-11-15 00:00， 完：2016-11-15 04:00 } ] var parseTime=d3。时间分析%Y-%m-%d%H:%m； var parseDay=d3。时间解析%e%b%Y； var formatDay=d3。时间格式%e%b%Y； //data.foreachd函数{ //开始=parseTimed.start； //consult=parseTimed.end； //如果开始.getDay！=结束.getDay{ ////这里有一张支票，以防他们相隔一天以上 // // 2016-11-04 12:00 // //上午=consult.getFullYear+-+consult.getMonth+1+-+consult.getDate+00:00； //console.logmorning是+morning； //数据推送{ //开始：早上好， //完:d // } //午夜=开始.getFullYear+-+开始.getMonth+1+-+开始.getDate+23:59； //console.logmidnight是+midnight； //d.结束=午夜； ////我们需要删除当前对象 ////它是数组中的哪个元素，读取'i' ////使用slice删除该元素数据。slicei、1或类似的soemthing // } // }; console.logJSON.stringifydata，null，2； data.foreachd函数{ d、 start=parseTimed.start； d、 end=parseTimed.end； d、 duration=d.end-d.start/60*1000/60；//会话持续时间（小时） d、 starttime=d.start.getHours； d、 endtime=d.end.getHours； d、 每日=formatDayd.start； d、 day=parseDayd.daily； 返回d； }, 函数错误、数据错误{ 如果错误抛出错误； }; document.getElementByIdjson.innerHTML=data.json+； 变量x=d3.scaleTime .domaind3.extentdata，函数d{ return d.day；//每天需要轮换 } .范围[0，宽度]； 变量y=d3.scaleLinear .domain[0,24] .范围[高度，0]； var group=svg.appendg； group.selectAll.bar .数据 进来 .appendrect .stylefill，蓝色 .职业，酒吧 .attrtransform，translate80,0 .attrx，函数d{ 返回xd.day+10； } .attry，函数d{ //如果d.endtime+d.duration>24{ //console.logoh编号： //console.logd.starttime:+d.starttime；//2 //console.logyd.starttime:+yd.starttime；//293.3333 //console.logd.endtime:+d.endtime；//18 //console.logyd.endtime:+yd.endtime；//80 //console.logd.duration:+d.duration；//16 //console.logyd.duration:+yd.duration；//106.6666 //console.logheight:+height；//320 //console.logy16:+y16；//106.6666 //console.logy24:+y24；//0 //console.logy0:+y0；//320 //console.logheight-yd.duration:+height-yd.duration；//320-106.666=213.333 // } 返回yd.endtime； } .宽度，20 .attr高度，功能{ 返回高度-码持续时间； //返回yd.starttime； } .stylefill，函数，i{ 返回颜色[i]； }; svg.appendg .attrclass，轴-x .ATRTransform，translate100，+高度+2+ .calld3.axisBottomx.ticksd3.timeDay.every1.tickFormatd3.timeFormat%e%b%Y //axis.ticksd3.timeMinute.every15； //.calld3.x 。选择全部文本 .styletext锚定，结束 .attrdx，-.8em .attrdy，.15em .attr变换，旋转-35； svg.appendg .attrclass，y轴 .attrtransform，translate80,0 .call3.axisLefty.ticks24 .附录文本 .attransform，旋转-90 .attry，0 .attrx，0 .attrdy，0.71em .attr文本锚定，结束 .TEXT持续时间小时；

---

因此，第一个条，即您遇到问题的条，基于以下数据：

d.endtime = d.end.getHours();

你是根据它的结束时间来定位它的，它是这样导出的

所以，这就是问题所在：如果你得到的是23:59的小时，那么它是23，而不是24：JavaScript不舍入到最近的小时，它只取小时部分。如果你想更准确 在y轴上，您可以：

使用非小时的东西，如分钟或秒。 为每个条形图创建一个时间刻度，其域在条形图时间范围之前/之后设置为午夜。

d.endtime = d.end.getHours();