#how do you set edge thickness?

1 messages · Page 1 of 1 (latest)

half berry
#

Title says it all

hearty cliff
#

You can use the style option for edges

const initialEdges: Edge[] = [
  {
    id: "e1-2",
    source: "1",
    target: "2",
    animated: true
  },
  { id: "e1-3", source: "1", target: "3", style: { strokeWidth: 10 } }
];
half berry
#
  • it's not doing it for me
  • i'm using BaseEdge directly
#

will post code in a few.

  • if i add strokewidth to g or pass style.strokeWidth to BaseEdge, it has no effect
hearty cliff
# 
<BaseEdge style={style} />
#

Are you doing this? Probably not 😄

half berry
# 
const CustomEdge = (props: SmoothStepEdgeProps<ReactFlowEdge["data"]>) => {
  const {
    sourceX,
    sourceY,
    targetX,
    targetY,
    sourcePosition = Position.Bottom,
    targetPosition = Position.Top,
    pathOptions,
    data,
    ...rest
  } = props) => { 
const [path, labelX, labelY] = getSmoothStepPath({
        sourceX,
        sourceY,
        sourcePosition,
        targetX,
        targetY,
        targetPosition,
        borderRadius: pathOptions?.borderRadius,
        offset: pathOptions?.offset,
      });
return  <g>
        <BaseEdge path={path} labelX={labelX} labelY={labelY} {...rest} />
      </g>
#

yea i am ... (not in the example i posted but yes)

hearty cliff
#

Mh... works fine in my sandbox though

#

So I'll have to assume the style prop is not passed correctly 🤔