D3.js绘制时间区间块时时间与刻度不匹配问题求助

嘿，我最近在D3里尝试一个简单的小需求——在指定的时间区间上绘制一个色块，但输出结果和时间轴上的刻度完全对不上，色块明显偏左太多，实在搞不定来求助！

我目前用到的代码如下（刚才粘贴的时候没写完，最后一行断了）：

// Declare the chart dimensions and margins.     
const width = 640;     
const height = 400;     
const marginTop = 20;     
const marginRight = 20;     
const marginBottom = 30;     
const marg

结合你描述的问题，我先给你列几个最常见的排查方向，你可以先检查下：

• 时间格式解析问题：你有没有用D3的d3.timeParse()或者d3.timeFormat()把你的时间数据转成标准的Date对象？如果时间轴刻度用了解析后的Date，但色块位置用了原始的字符串/时间戳，肯定会出现错位。
• 比例尺映射错误：你在计算色块的x坐标和宽度时，是不是正确使用了时间比例尺（d3.scaleTime()）？比如应该用xScale(startTime)来获取色块的起始像素位置，xScale(endTime) - xScale(startTime)来计算色块宽度，如果直接用时间的原始数值计算就会出错。
• 边距计算遗漏：你定义了画布的边距，但绘制色块时有没有把marginLeft（你代码里没写完的应该是这个参数吧？）算进去？如果色块的x坐标直接从0开始，没有加上左边距，就会看起来偏左。

要是能把完整的代码（包括时间数据定义、比例尺设置、色块绘制的完整逻辑）贴出来，就能更精准地定位问题啦！

备注：内容来源于stack exchange，提问作者mydoghasworms