SVG isPointInFill() Method
isPointInFill() tests whether a given point lies inside a shape's fill, enabling precise geometry-based hit detection.
Drop your image here
Supports PNG, JPG, BMP, WEBP up to 5MB
Testing Whether a Point Is Inside a Fill
Calling isPointInFill(point) on an SVG geometry element returns true if the given SVGPoint lies within the element's filled area, providing precise, shape-accurate hit testing that respects the actual geometry rather than just a rectangular bounding box, which matters for irregularly shaped clickable elements.
- isPointInFill(point) returns true if the point lies within the shape's fill
- Provides precise hit testing that respects the actual shape geometry
- More accurate than bounding-box testing for irregular shapes
Practical Uses for Precise Hit Testing
isPointInFill() is useful for building custom interactive SVG where clicks should only register within a shape's actual visible area (like clicking a specific country on a map with an irregular border), or for implementing custom drag, hover, or selection behavior that respects complex shape boundaries rather than approximate rectangular regions.
- Registers clicks only within a shape's actual visible irregular area
- Useful for map interactions respecting complex country or region borders
- Enables custom drag, hover, or selection respecting true shape boundaries
Frequently Asked Questions
What's the difference between isPointInFill() and isPointInStroke()?
isPointInFill() tests whether a point is inside the shape's filled interior area, while isPointInStroke() tests whether the point falls on the shape's stroke outline — useful for different interaction needs.
Do I need to convert the point to user coordinates before calling isPointInFill()?
Yes, the point passed to isPointInFill() should be in the element's user coordinate system, so a mouse-event point typically needs the getScreenCTM() inverse conversion first.
Related guides
Ready to Convert Your Image to SVG?
Free online converter — no sign-up, no watermarks, results in under 3 seconds.
Try It Free — Convert Image to SVG