Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Piecewise scales can result in tick collisions #222

Open
ColinEberhardt opened this issue Sep 21, 2020 · 0 comments
Open

Piecewise scales can result in tick collisions #222

ColinEberhardt opened this issue Sep 21, 2020 · 0 comments

Comments

@ColinEberhardt
Copy link

It's relatively common to see a scale that has a 'break' in it, allowing you to render outliers. You can achieve this effect with a piecewise scale that collapses a section of the domain.

For example, this will remove the section of the scale from 50-75:

svg.append('g')
    .attr('transform', 'translate(0, 60)')
    .call(sel => {
        const scale = d3
            .scaleLinear()
            .domain([0, 50, 75, 100])
            .range([0, 400, 400, 600]);

        d3.axisBottom(scale)(sel);
    });

However, when rendered with an axis, the ticks pile up as follows:

image

Should scales filter ticks if they collide?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

1 participant