Bug: Incorrect y2axis title left margin

[matbech]

When you look at the small version of the "Advanced Titles Example" at http://www.humblesoftware.com/flotr2/index you will notice that the label (y=x^3) is too close to the y2 axis. This is not as apparent in the full version of the example as there is enough space available for the label between two ticks. The problem is here:

   // Add y2 axis title
      if (a.y2.options.title && a.y2.used){
        style.textAlign = a.y2.options.titleAlign || 'left';
        style.textBaseline = 'middle';
        style.angle = Flotr.toRad(a.y2.options.titleAngle);
        style = Flotr.getBestTextAlign(style.angle, style);
-> incorrect style.textBaseline
        Flotr.drawText(
          ctx, a.y2.options.title,
          this.plotOffset.left + this.plotWidth + a.y2.maxLabel.width + 2 * margin, 
          this.plotOffset.top + this.plotHeight / 2,
          style
        );
      }

More specifically in the calculation of the textBaseline. For a 270 degree titleAngle the style.textBaseline should be bottom, for a 90 degree titleAngle it should be top. Right now the exact opposite is the case.

[webalchemist]

I have this issue too. The y2 axis title is being written over the y2 axis tick values.

I have used the following HACK! It works for my particular use, but I haven't tested it more widely. Use at your own risk!

• add new parameter to Flotr.getBestTextAlign to say whether this is a call for y2Axis (line #1562)

  getBestTextAlign: function(angle, style, isY2) {
    isY2 = isY2 || false;
    style = style || {textAlign: 'center', textBaseline: 'middle'};
    angle += Flotr.getTextAngleFromAlign(style);

    if (Math.abs(Math.cos(angle)) > 10e-3) 
      style.textAlign    = (Math.cos(angle) > 0 ? 'right' : 'left');

    if (Math.abs(Math.sin(angle)) > 10e-3){
        if(isY2){
            style.textBaseline = (Math.sin(angle) > 0 ? 'bottom' : 'top');
        }else{
            style.textBaseline = (Math.sin(angle) > 0 ? 'top' : 'bottom');
        }
    }
    return style;
  },

• update just the y2 axis call (currently line #7126)

      // Add y2 axis title
      if (a.y2.options.title && a.y2.used){
        style.textAlign = a.y2.options.titleAlign || 'left';
        style.textBaseline = 'middle';
        style.angle = Flotr.toRad(a.y2.options.titleAngle);
        style = Flotr.getBestTextAlign(style.angle, style, true); /*** ',true' added ***/