Impossible to select the entire summary? about envisionjs HOT 10 OPEN

(Please keep in mind that I've never written any JS... I could be totally mistaken.)

After investigation I believe this is caused by the boundX function in selection.js (from Flotr2).

function boundX(x, graph) {
  return Math.min(Math.max(0, x), graph.plotWidth - 1);
}

The selection is set to a maximum of width - 1. In my case summary.api.flotr.selection.selection.second.x is maxed at 847, instead of the initial width of 848.

The interesting part is how this maxed width is then multiplied with the axis scale:

 setSelection: function(area, preventEvent){
    var options = this.options,
      xa = this.axes.x,
      ya = this.axes.y,
      vertScale = ya.scale,
      hozScale = xa.scale,
      selX = options.selection.mode.indexOf('x') != -1,
      selY = options.selection.mode.indexOf('y') != -1,
      s = this.selection.selection;

    this.selection.clearSelection();

    s.first.y  = boundY((selX && !selY) ? 0 : (ya.max - area.y1) * vertScale, this);
    s.second.y = boundY((selX && !selY) ? this.plotHeight - 1: (ya.max - area.y2) * vertScale, this);
    s.first.x  = boundX((selY && !selX) ? 0 : (area.x1 - xa.min) * hozScale, this);
    s.second.x = boundX((selY && !selX) ? this.plotWidth : (area.x2 - xa.min) * hozScale, this);

    this.selection.drawSelection();
    if (!preventEvent)
      this.selection.fireSelectEvent();
  },

Yet the scale in Axis.js isn't based on the width -1, but rather on the width/length directly:

 setScale : function () {
    var
      length = this.length,
      max = this.max,
      min = this.min,
      offset = this.offset,
      orientation = this.orientation,
      options = this.options,
      logarithmic = options.scaling === LOGARITHMIC,
      scale;

    if (logarithmic) {
      scale = length / (log(max, options.base) - log(min, options.base));
    } else {
      scale = length / (max - min);
    }
    this.scale = scale;

from envisionjs.

Should I open an issue in Flotr2 instead of Envision?

from envisionjs.

Could you please fork this with your reproduction? http://jsfiddle.net/cesutherland/LurmY/49/

from envisionjs.

The same behavior is already present in this jsfiddle.
Here is a comparison of the selections one can make on the left and right side.

Complete selection up to the 'touching' point.

The two lines never meet!

from envisionjs.

Ah, got it!

from envisionjs.

Would you prefer if i opened this as a Flotr2 issue?

from envisionjs.

Thank you, no... it's an issue en the envision data processing. I'll take a look at it. Maybe off-by-1 heh...

from envisionjs.

Bump!

Any changes?

from envisionjs.

I have found this issue in my project as well.
I collected some data that might help you:

As you can see with the data above, it seems to be an off-by-one error.
((# of points missing) / (# of points)) * (px width of chart) is always close to 1.

I also tried this with a few smaller examples, (all the way down to 2 data points). The last data point was always missing when I tried to select some area.

As mentioned above, by @Frozenlock , when I click the summary list to reset the selection, the whole data pool is displayed.

from envisionjs.

I have found the off-by-one error to be in flotr2.js function called boundX.
The implementation of the function is:
return Math.min(Math.max(0, x), graph.plotWidth - 1);
where it should be:
return Math.min(Math.max(0, x), graph.plotWidth);

This is in line # 4117 in the envision.js file.

After some testing on my charts, this seems to cause no error and fixes all my problems.
I will submit a pull request when I am able.

from envisionjs.