---
title: "CanvasDrawPath | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Interface CanvasDrawPath

interface CanvasDrawPath {  
    [beginPath](#beginpath-1)(): void;  
    [clip](#clip-1)(fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void;  
    [clip](#clip-2)(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void;  
    [fill](#fill-1)(fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void;  
    [fill](#fill-2)(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void;  
    [isPointInPath](#ispointinpath-1)(x: number, y: number, fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): boolean;  
    [isPointInPath](#ispointinpath-2)(  
        path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/),  
        x: number,  
        y: number,  
        fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/),  
    ): boolean;  
    [isPointInStroke](#ispointinstroke-1)(x: number, y: number): boolean;  
    [isPointInStroke](#ispointinstroke-2)(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), x: number, y: number): boolean;  
    [stroke](#stroke-1)(): void;  
    [stroke](#stroke-2)(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)): void;  
}

#### Hierarchy ([View Summary](https://docs.maptiler.com/sdk-js/api-reference/hierarchy/#Externals.CanvasDrawPath))

-   CanvasDrawPath
    -   [CanvasRenderingContext2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.CanvasRenderingContext2D/)
    -   [OffscreenCanvasRenderingContext2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.OffscreenCanvasRenderingContext2D/)

##### Index

### Methods[](#methods)

[beginPath](#beginpath) [clip](#clip) [fill](#fill) [isPointInPath](#ispointinpath) [isPointInStroke](#ispointinstroke) [stroke](#stroke)

## Methods[](#methods-1)

### beginPath[](#beginpath)

-   beginPath(): void[](#beginpath-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/beginPath)
    
    #### Returns void
    

### clip[](#clip)

-   clip(fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void[](#clip-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/clip)
    
    #### Parameters
    
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns void
    
-   clip(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void[](#clip-2)
    
    #### Parameters
    
    -   path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns void
    

### fill[](#fill)

-   fill(fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void[](#fill-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fill)
    
    #### Parameters
    
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns void
    
-   fill(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): void[](#fill-2)
    
    #### Parameters
    
    -   path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns void
    

### isPointInPath[](#ispointinpath)

-   isPointInPath(x: number, y: number, fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)): boolean[](#ispointinpath-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInPath)
    
    #### Parameters
    
    -   x: number
    -   y: number
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns boolean
    
-   isPointInPath(  
        path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/),  
        x: number,  
        y: number,  
        fillRule?: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/),  
    ): boolean[](#ispointinpath-2)
    
    #### Parameters
    
    -   path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)
    -   x: number
    -   y: number
    -   `Optional`fillRule: [CanvasFillRule](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.CanvasFillRule/)
    
    #### Returns boolean
    

### isPointInStroke[](#ispointinstroke)

-   isPointInStroke(x: number, y: number): boolean[](#ispointinstroke-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInStroke)
    
    #### Parameters
    
    -   x: number
    -   y: number
    
    #### Returns boolean
    
-   isPointInStroke(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/), x: number, y: number): boolean[](#ispointinstroke-2)
    
    #### Parameters
    
    -   path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)
    -   x: number
    -   y: number
    
    #### Returns boolean
    

### stroke[](#stroke)

-   stroke(): void[](#stroke-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/stroke)
    
    #### Returns void
    
-   stroke(path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)): void[](#stroke-2)
    
    #### Parameters
    
    -   path: [Path2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Path2D/)
    
    #### Returns void