Add proper marker usage description in documentation

[maliyshock]

Code of Conduct

• I have read and agree to the xyflow contributor Code of Conduct

Which site are you suggesting a change for?

reactflow.dev

What content is affected by this change?

https://reactflow.dev/examples/edges/markers
and
https://reactflow.dev/examples/edges/custom-edges
and
https://reactflow.dev/api-reference/components/base-edge

What part(s) of the article would you like to see updated?

So basically there might be a case of customer edge with custom marker.
So we need an example of BaseEdge component for this case

Right now it says: "markerEnd | stringThe id of the SVG marker to use at the end of the edge. This should be defined in a element in a separate SVG document or element."

But it is not exactly the truth, because if you put just an id it will not work.
These examples will not work:
<BaseEdge id={id} markerEnd="#marker" path={edgePath} style={{ strokeWidth: "4px" }} />
<BaseEdge id={id} markerEnd="marker" path={edgePath} style={{ strokeWidth: "4px" }} />

Instead you have to use "url(#marker)" in markerEnd prop.
This will work

<BaseEdge id={id} markerEnd="url(#marker)" path={edgePath} style={{ strokeWidth: "4px" }} />

Additional information

No response

[moklick]

This is good feedback! We could extend our existing examples and give some more context here.