Line Chart - line on the edge get cut fix ( #4202)

[serhii-yakymuk]

Extending chartArea to contain thicker lines at the edges.

Fixes #4202

[martijnmelchers]

Please merge this, this has been an issue since 2.4! Please...

[simonbrunel]

We should not recompute the border width in draw, it's already done in update().

I think meta.dataset._model.borderWidth is more accurate:

var halfBorderWidth = (meta.dataset._model.borderWidth || 0) / 2;

[serhii-yakymuk]

@simonbrunel
Tests are failing now with:
TypeError: Cannot read property 'borderWidth' of undefined

Any ideas how can I fix this?

[simonbrunel]

I should have read update() more carefully because _model is only available if options.showLine: true.

We could also avoid clipping if there is nothing to draw ...

if (lineEnabled(me.getDataset(), chart.options)) {
    halfBorderWidth = (meta.dataset._model.borderWidth || 0) / 2;

    helpers.canvas.clipArea(chart.ctx, {
        left: area.left,
        right: area.right,
        top: area.top - halfBorderWidth,
        bottom: area.bottom + halfBorderWidth
    });

    meta.dataset.draw();

    helpers.canvas.unclipArea(chart.ctx);
}

[simonbrunel]

Please verify that it works locally, I didn't test it, neither that tests pass (gulp test).

[serhii-yakymuk]

@simonbrunel
Yeah that fixed the problem, did some manual tests too, everything seems fine for both options: showLine: true and showLine: false.

[ldemailly]

That's awesome, Any chance to put this in a release, looks like it missed 2.7.2 which starts to be old?

[armenzg]

What's required to include this in a release?
Until all issues in https://github.com/chartjs/Chart.js/milestone/17 are tackled?
I'm new to the project.

Thanks for a great product!

[nagix]

This fix has been included and released in 2.7.3.