Charts 如何为日期设置dc.js x轴

我有一个CSV文件，有两列，第一列有一些日期，第二列有一些值

---

如何初始化x轴以显示日期？

我解决您的问题包括两部分：

将数据中的日期解析为dc可管理格式

对图表进行编码

要解析日期，在脚本中注入csv文件后，需要使用如下函数：

    var parseDate = d3.time.format.utc("%Y-%m-%dT%H:%M:%S-07:00").parse;

data.forEach(function(d) {
        d.TxnDate = parseDate(d.TxnDate);
    });

请注意，根据您的数据，解析条件可能不同，在这种情况下，请检查此项

对于第二部分，这里是一个示例图表定义，但在此之前，您需要定义两个新变量，作为X轴的起点和终点。在定义了维度和组后，按如下方式定义它们：

    var minDate = transactionDate.bottom(1)[0].TxnDate;
var maxDate = transactionDate.top(1)[0].TxnDate;

图表的代码如下所示：

timeChart
.width(650)
.height(250)
.transitionDuration(1000)
.brushOn(false)
.dimension(transactionDate) //your dimension created from crossfilter
.group(fakeTxnDateGroup) // your group
.elasticY(true)
.renderHorizontalGridLines(true)
.renderVerticalGridLines(true)
.x(d3.time.scale().domain([minDate,maxDate])) //these are the dates we created before this step so that the scale fits according to our data
.yAxis().tickFormat(d3.format("s"));

我希望这对你有帮助。如果没有，请留下一把js小提琴。

---

谢谢

哪些问题？你能提供更多的细节吗？我有一个CSV文件，第一列是日期，第二列是数值。我不能把CSV文件的日期放在我的timeseries图表中，它是用DC.js库生成的…我怎么能把日期放在x轴的域中呢@为了清楚起见，请核对您的问题。我可以在周一找到一个例子。的确，我们缺少了一个设置日期轴的具体示例，但是查看的

移动图表
和
volumeChart
可能会有所帮助。可能需要
.xUnits（）
才能获得正确的条宽？另外，这跳过了按天/小时/分钟进行的聚合，这是另一个棘手的部分。@Gordon我有一个我认为你的评论会解决的问题：x轴时间分布中每个日期的铅笔细条。如何使用.xUnits（）设置宽度，使条形图看起来正常？数据是dates（零时间元素）Hi@CodeMantle，通常您将设置xUnits，其范围与您正在聚合的时间单元对应，如
d3.timeDays
或
d3.timeMonths
。（注意复数形式是范围，单数形式是binning函数。）这会告诉图表将显示多少条，并由此计算宽度。@Gordon关于设置xUnits，你能回顾一下我发布的这个问题吗，希望包括所有必要的代码：？