时间戳

首页 > 解决方案 > d3.timeWeek ，一周的第一天

javascript - d3.timeWeek ，一周的第一天

问题描述

我对 D3.timeWeek 有疑问，我用它来指定 x 轴上的刻度：

    plotXaxis: function (svg) {
  var x = d3scaleTime()
    .domain(
      d3extent(this.series, function (d) {
        return d.date;
      })
    )
    .range([0, this.width]);

  svg
    .append("g")
    .attr("transform", "translate(0," + this.height + ")")
    .call(
      d3axisBottom(x)
        .ticks(d3timeWeek.every(1))
        .tickFormat(d3timeFormat("%d. %b"))
    );

这给了我一个非常漂亮的 x 轴，数据中每周都有一个刻度。问题是 D3 意味着一周从星期日开始，所以我的 x 轴上的日期都是星期日 -比如 07-03-2021 而不是 08-03-2021。

我希望它从星期一开始以适应丹麦的文化，我曾希望在 d3.timeWeek 上进行一些文化设置？

标签： javascriptdated3.js

解决方案

只需使用d3.timeMonday：

const svg = d3.select("svg");
const now = new Date;
const x = d3.scaleTime()
  .domain([d3.timeMonth.floor(now), d3.timeMonth.ceil(now)])
  .range([20, 480]);

svg.append("g")
  .attr("transform", "translate(0,50)")
  .call(d3.axisBottom(x)
    .ticks(d3.timeMonday.every(1))
    .tickFormat(d3.timeFormat("%d. %b"))
  );
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<svg width="500"></svg>

推荐阅读