How to keep the line same width?

[Neil]

The top line is thinner than others. ("react-art": "^0.14.0")

import React from 'react';
import { Surface, Group, Shape, Path } from 'react-art';

function Line() {
  const d = Path();
  d.moveTo(10, 10).lineTo(10, 0).lineTo(300, 0).lineTo(300, 10);
  return <Shape stroke="#000000" strokeWidth={1} d={d} />;
}

export default function App() {
  return <Surface width={500} height={300}>
    <Line />
    <Group x={10} y={5}>
      <Line />
    </Group>
  </Surface>;
}

[Sophie Alpert]

I would guess that the stroke is centered on the top border of the canvas, so half of it is outside and gets cut off.

[Neil]

The borders are in the same situation.
Is it a normal behaviour? Have to set the margin myself.

[Neil]

Canvas calculates from the half of a pixel.
http://stackoverflow.com/questions/13879322/drawing-a-1px-thick-line-in-canvas-creates-a-2px-thick-line