Line annotation when specified with borderWidth:1, the final width of line is 2px
skopz356 opened this issue · comments
When using line annotation with borderWidth: 1, the final width of the line is 2px.
Step to reproduce:
- Open https://www.chartjs.org/chartjs-plugin-annotation/latest/samples/line/visibility.html
- Screen the website using PixelZoomer
- Measure the width of the line "Now"
The width is 2px even when borderWidth is set to 1px.
I would be happy to create a pull request if someone points me to the right direction.
@skopz356 thank you very much for this issue.
To support your issue: https://usefulangle.com/post/17/html5-canvas-drawing-1px-crisp-straight-lines
To fix, we should check the borderWidth if odd or not and then change the annotation element size calculation as described in the document.
All annotation element sizes are calculated in the resolveElementProperties(chart, options) method of the annotation elements (in src/types).
This will affect also the test cases which should be changed.
Let me know if more info are needed to submit a PR. Otherwise I'll have a look asap.
@skopz356 maybe it can help, you could try to set borderWidth: 0.5. It doesn't solve completely but improve.