Search code examples
javascriptjqueryflotaxis-labels

Keep default tickSize but add a single tick


In a jquery flot chart, I try to keep the default tickSize ( managed by the plugin itself, and I'm happy with the decisions made ), but I want to show on the axis one specific value, in fact the last value of my serie.

For instance on the fiddle below, its really useful for my users to have the tickSize 1 or 0.5 ( the default one ), but also 0.8 which is the last value of the serie.

Any clue ?

Thanks

http://jsfiddle.net/50mea86h/

$.plot(
    $("#placeholder"), 
  [ d1 ], 
  {
  yaxes: [ { tickSize: 0.5, ticks: [ 0.8 ]}]
  }
);

Solution

  • You can plot the original chart with the default ticks, then read the ticks, add your extra tick and plot the chart again with the new ticks. Something like this:

    var plot = $.plot(
        $("#placeholder"),
        [d1]
    );
    
    var newticks = plot.getAxes().yaxis.ticks.map(t => t.v);
    newticks.push(0.8);
    
    plot = $.plot(
        $("#placeholder"),
        [d1], {
            yaxis: {
                ticks: newticks
            }
        }
    );
    

    Link to fiddle.