How can I format my y-axis labels to show two decimals places I checked my code and what happens is that, instead of displaying 14.59 it displays 15.00, Here is my code below:

$.plot("#placeholder", data, {
                xaxis: {
                    min: minDate,
                    max: maxDate,
                    mode: "time",
                    tickSize: setTickSize,
                    monthNames: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"]
                },
                yaxis: {
                    min: yMin,
                    max: yMax,
                    ticks: 1,
                    tickSize: 1,
                    tickDecimals:2
                },
                series: {
                    lines: {
                        show: true,
                        fill: true
                    },
                    points: {
                        show: false
                    }
                },
                grid: {
                    borderWidth: 1,
                    hoverable: true
                }
            });

I've read that I can use a tickFormatter function but I don't know where exactly to put it as well.

How can I format my y-axis labels to show two decimals places I checked my code and what happens is that, instead of displaying 14.59 it displays 15.00, Here is my code below:

$.plot("#placeholder", data, {
                xaxis: {
                    min: minDate,
                    max: maxDate,
                    mode: "time",
                    tickSize: setTickSize,
                    monthNames: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"]
                },
                yaxis: {
                    min: yMin,
                    max: yMax,
                    ticks: 1,
                    tickSize: 1,
                    tickDecimals:2
                },
                series: {
                    lines: {
                        show: true,
                        fill: true
                    },
                    points: {
                        show: false
                    }
                },
                grid: {
                    borderWidth: 1,
                    hoverable: true
                }
            });

I've read that I can use a tickFormatter function but I don't know where exactly to put it as well.

• javascript
• jquery
• flot

• Do you want to format the labels on hover to display the decimals or the actual axis? Have a look at this for the first issue - link – Blake Commented Mar 27, 2014 at 14:53
• Nope I just want it on normal display because the numbers on my y-axis dynamically changes to show a new set of range. – a_miguel6687 Commented Mar 28, 2014 at 7:56

1 Answer 1

You can build a ticks array with your y axis data points since it is dynamic and pass it to the yaxis ticks.

yaxis: {
         ticks: [25.49, 28.49, 31.49, 34.49, 37.49, 40.49],
               
         tickDecimals:2
       }

var data = [];
data = [
  [3, 36.86],
  [5, 29.66],
  [8, 33.47]
];



dataLine = [];
dataLine.push(data);

$.plot($("#placeholder"), dataLine, {


  grid: {
    backgroundColor: "#E5E5E5",
    hoverable: true
  },

  points: {
    show: true,
    radius: 4
  },

  lines: {
    show: true
  },
  yaxis: {

    ticks: [25.49, 28.49, 31.49, 34.49, 37.49, 40.49],

    tickDecimals: 2
  }
});

<script src="https://cdnjs.cloudflare./ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://www.pureexample./js/flot/jquery.flot.min.js"></script>
<div id="placeholder" style="width:400px;height:300px;"></div>