Add proper marker usage description in documentation #477
Labels
react-docs
Issues belonging to the reactflow website
svelte-docs
Issues belonging to the svelteflow website
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
Additional information
No response
The text was updated successfully, but these errors were encountered: