Fix label layers

pierpo · Jul 9, 2019 · a826ab6 · a826ab6
1 parent 8e18ce6
commit a826ab6
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/SvgArrow.js b/src/SvgArrow.js
@@ -169,14 +169,14 @@ const SvgArrow = ({
         markerEnd={`url(${location.href}#${arrowMarkerId})`}
       />
       {arrowLabel && (
-        <foreignObject x={xl} y={yl} width={wl} height={hl} style={{overflow:'visible'}}>
+        <foreignObject x={xl} y={yl} width={wl} height={hl} style={{overflow:'visible', pointerEvents: 'none'}}>
           <div
             style={{
-              width: wl,
-              height: hl,
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
+              position: 'absolute',
+              left: '50%',
+              top: '50%',
+              transform: 'translateX(-50%) translateY(-50%)',
+              pointerEvents: 'all'
             }}
           >
             <div>{arrowLabel}</div>