Lines not using crispEdges show up fuzzy on non-retina screens

I’m using a windows machine to develop and I noticed that the lines in vx were fuzzy. I found this explanation, which seems to be correct.

Expand images to see sharpness of bottom axis:

Current

With shape-rendering="crispEdges" on line or parent g

Would you be open to adding shape-rendering="crispEdges" for lines? The only downside to using crispEdges is that it produces sharp edges even for rounded objects. The Line and Axis components currently don’t make rounded shapes, so I think adding it to those will be safe at least.

[jbanulso]

Hi @hshoff, that will do it, thank you for the quick answer. And thank you for the great work with this library, it’s great to see the progress over the last years 🚀

[hshoff]

Hi @jbanulso, for now the work around would be to set shape-rendering: auto; on the line. This resets shape-rendering to the default value by overriding the previous value.

<Line
  from={{ x: x1, y: y1 }}
  to={{ x: x2, y: y2 }}
+ shapeRendering="auto"
/>