CODEWITHSUNDEEP
javascripthighcharts
wergeld
wergeld

Reputation: 14442

How to show only integer values on yAxis of HighChart?

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: ''
  }
},

Upvotes: 45

Views: 37531

Answers (2)

Buddhi Hasanka
Buddhi Hasanka

Reputation: 79

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

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

Upvotes: 2

Asad Saeeduddin
Asad Saeeduddin

Reputation: 46628

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/

Upvotes: 129

Related Questions