esnet / esnet/react-timeseries-charts

Ability to add a suffix to axis ticks

Open
#127 6 comments 0 reactions 0 assignees View on GitHub
:octocat: help wanted :sparkles: enhancement
Dominant language
JavaScript
Stars
876
Forks
279
PR merge metrics
No merged PRs in 30d

Description

Is there any possible way to add a suffix to the ticks on a yAxis component?

I noticed in some examples, the suffix seems to change, but I can't quiet pinpoint how it's done. Basically, what do you do when `d3.format` rules alone are not enough? For example adding a (kb/mb/gb) to the ticks in the yAxis?

I know the examples on the site generally show something like "Traffic Measured in (bps)" -- but once that label is set, it can't be changed (I've tried) -- so keeping that dynamic is a little difficult. I am about to resort to just making the label invisible and absolutely positioning my own, which seems like a terrible idea.

Contributor guide

Open the contributing guide

Research direction

Start with the yAxis component and the existing chart examples that use d3.format. Trace how the axis tick format and the Traffic Measured in label are configured, then determine how a dynamic suffix could be supplied. Done means y-axis ticks can display units such as kb, mb, or gb without manually positioning a separate label.

Written by the indexing model from the issue text.

Assessment

Tech stack
d3js, javascript, react
Domain
data-visualization, frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.