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

Wrong position for added ticks x-axis after zoom #7463

Closed
kzoon opened this Issue Nov 28, 2017 · 2 comments

Comments

Projects
None yet
3 participants
@kzoon

kzoon commented Nov 28, 2017

Expected behaviour

When using the tickposition option, the x-axis sometimes adds an additional tick. This tick should be in the right position

Actual behaviour

1 The added tick can be outside the zoomed range
2 The added tick sometimes is not on a category

Live demo with steps to reproduce

1 The added tick can be outside the zoomed range: http://jsfiddle.net/kzoon/suyokcuL/1/:
zoom between august 2011 and April 2012 gives a tick on January 2012, but zoom between Jan 2011 and august 2011 gives no tick at all.

2 The added tick sometimes is not on a category:
http://jsfiddle.net/kzoon/yhagvbg6/1/

Affected browser(s)

All

My analysis

Caused by axis trimTicks method:
Problem 1 is caused because the added tick is calculated by calculation the mean of the first and the last item in tickPositions, disregarding the fact that it might be outside the current zoom range. Solution:
Use the actual max and min of the axis
Problem 2 is caused because the calculated mean is not rounded

This code is my workaround, but should probably be polished:

    if (tickPositions.length === 0 && defined(roundedMin)) {
             if (this.categories) {
                 tickPositions.push(Math.round((this.min + this.max) / 2));
             } else {
                 tickPositions.push((roundedMax + roundedMin) / 2);
             }
         }
@KacperMadej

This comment has been minimized.

Show comment
Hide comment
@KacperMadej

KacperMadej Nov 28, 2017

Contributor

Hi,

Thank you for reporting about the problem.
In general use tickPositioner if outcome of tickPositions option is not working as you need.

Issue summed up:

  • number ticks for category type axis are not acceptable - check:

    highcharts/js/parts/Axis.js

    Lines 3254 to 3257 in c904e1f

    // If no tick are left, set one tick in the middle (#3195)
    if (tickPositions.length === 0 && defined(roundedMin)) {
    tickPositions.push((roundedMax + roundedMin) / 2);
    }
  • possibly disable the fix for #3195 if tickPositions are given from user options
Contributor

KacperMadej commented Nov 28, 2017

Hi,

Thank you for reporting about the problem.
In general use tickPositioner if outcome of tickPositions option is not working as you need.

Issue summed up:

  • number ticks for category type axis are not acceptable - check:

    highcharts/js/parts/Axis.js

    Lines 3254 to 3257 in c904e1f

    // If no tick are left, set one tick in the middle (#3195)
    if (tickPositions.length === 0 && defined(roundedMin)) {
    tickPositions.push((roundedMax + roundedMin) / 2);
    }
  • possibly disable the fix for #3195 if tickPositions are given from user options

@KacperMadej KacperMadej added the Bug label Nov 28, 2017

@TorsteinHonsi

This comment has been minimized.

Show comment
Hide comment
@TorsteinHonsi

TorsteinHonsi Dec 7, 2017

Collaborator

In my opinion, there should be no extra tick inserted at all in this case, because the tick positions were explicitly set.

Collaborator

TorsteinHonsi commented Dec 7, 2017

In my opinion, there should be no extra tick inserted at all in this case, because the tick positions were explicitly set.

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