Half years for time axis

Open
#46 2 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Stale
Tech stack
d3, javascript

Research direction

Start by reading the time tick interval selection code and its tests; the issue does not name specific files. Trace how the current 3-month and 12-month intervals are selected across a year-long span. Done means the axis can choose a 6-month interval and avoid producing a lone January tick when a midyear label would help.

Written by the indexing model from the issue text.

Description

The time axis seems to consider 3 months or 12 months when it should decide how many ticks to generate. That's a big jump and often leaves the axis with a single tick at the beginning of a year. Axes with a single label are always very hard to read, so a second label at the middle of the year would be necessary. And when jumping from 3 to 12 months interval, there's still plenty of space for selecting 6 months until the time span gets so long that two beginnings of a year appear.

I can halfway work around that by generating ticks and counting them. If the result is 1, I need to suggest more ticks, no matter the available space. But it still has the problem that an axis with ticks at January and July is never displayed and so month names overlap quite a bit before only years are generated. A single tick doesn't tell the user anything. Overlapping labels at least tell the user to assign more space.

Dominant language
JavaScript
Stars
238
Forks
55
Avg merge
6h 15m
Merged PRs (30d)
1

Getting set up

This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from d3/d3-time

All issues in d3/d3-time

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.