45

We have a set of a data that contains counts of instances of events. These can only be integers. When we display data that has a high enough yValue the yAxis labels are integers. However, when we zoom in to ranges of data that have under y = 5 we see the tick markers show things like 0.5, 0.75, 1.5, etc. How can we force the yAxis labels to only show integer values?

Here is an example bit of code with some data. As you zoom in to the lower value region of the chart you can see what I mean. This is the current yAxis setup:

yAxis: {
  labels: {
    style: {
      fontSize: '9px',
      width: '175px'
    }
  },
  title: {
    text: ''
  }
},

2 Answers 2

128

Set the allowDecimals option in the y axis to false in order to prevent non integer tick marks from being displayed:

yAxis: {
    allowDecimals: false,
    labels: {
        style: {
            fontSize: '9px',
            width: '175px'
        }
    },
    title: {
        text: ''
    }
}

Here is a demonstration: http://jsfiddle.net/sBC9K/

6
  • @wergeld But Rikonator's answer only works for this case. You can see on the following chart: jsfiddle.net/R8Hub/1 It doesn't work because the tickInterval is higher than 1. And on the same chart using allowDecimals it works. jsfiddle.net/R8Hub/2. So this is the right answer. Jan 9, 2013 at 16:45
  • @RicardoLohmann, that is interesting - wouldn't this be a bug in HighStock? Yes, I can see that the allowDecimals is a more complete answer but the minTickInterval worked as advertised in my case.
    – wergeld
    Jan 9, 2013 at 17:11
  • 1
    @wergeld It's not a bug, I explained that it happens because the tickinterval for higher values is higher than 1, it doens't prevent numbers higher than 1, just lower. Jan 9, 2013 at 17:13
  • 6
    @RicardoLohmann Actually, I agree. A minTickInterval of 1 doesn't mean that the tickInterval can't be 2.5 or some other decimal value greater than 1. Here's where it breaks in your example; jsfiddle.net/uDg9k/6. So, yeah. @Asad's answer is correct.
    – Rikonator
    Jan 9, 2013 at 17:14
  • Well, I am not setting tickInterval at all. And I do not see it being set in the examples @RicardoLohmann mentioned. But, I definitely see this as an issue going forward with our charts where we are setting tickInterval. Giving Asad the answer.
    – wergeld
    Jan 9, 2013 at 17:19
1

Wiht echarts - "4.8.0" you just have to do,

options = {
            yAxis: {
              minInterval: 1
            }
          };

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.