Different default position in UI if ordering is different

[WayneTvT]

This the correct position:

If I remove point 1 and add it again it will be come this:

Otherwise, If I remove point 2 and add again will resume normal. Seems the ordering need to be point 1 first and point 2 after.

I added an Image for the background so the container position is "absolute", I tried change it to "relative" but same result.

<div
	style={{
		position: "absolute",
		height: height+'px',
		width: width+'px',
		top: 0,
		left: 0
	}}
>
{
	devices.map((d, i) => {
		return (
			<Draggable
			key={`devices-${d.r_id}`}
			axis="x"
			defaultPosition={{x: d.r_x, y: d.r_y}}
			scale={1}
			bounds="parent">
				<div className="location-fade-in-out">
					{d.r_id}
				</div>
			</Draggable>
			)
	})
}
</div>