---
title: "CirclePaintProps | 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.

# Type Alias CirclePaintProps

type CirclePaintProps \= {  
    ["circle-blur"](#circle-blur): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["circle-color"](#circle-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["circle-opacity"](#circle-opacity): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["circle-pitch-alignment"](#circle-pitch-alignment): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>;  
    ["circle-pitch-scale"](#circle-pitch-scale): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>;  
    ["circle-radius"](#circle-radius): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["circle-stroke-color"](#circle-stroke-color): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>;  
    ["circle-stroke-opacity"](#circle-stroke-opacity): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["circle-stroke-width"](#circle-stroke-width): [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>;  
    ["circle-translate"](#circle-translate): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>;  
    ["circle-translate-anchor"](#circle-translate-anchor): [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>;  
}

##### Index

### Properties[](#properties)

[circle-blur](#circle-blur) [circle-color](#circle-color) [circle-opacity](#circle-opacity) [circle-pitch-alignment](#circle-pitch-alignment) [circle-pitch-scale](#circle-pitch-scale) [circle-radius](#circle-radius) [circle-stroke-color](#circle-stroke-color) [circle-stroke-opacity](#circle-stroke-opacity) [circle-stroke-width](#circle-stroke-width) [circle-translate](#circle-translate) [circle-translate-anchor](#circle-translate-anchor)

## Properties[](#properties-1)

### circle-blur[](#circle-blur)

"circle-blur": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### circle-color[](#circle-color)

"circle-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### circle-opacity[](#circle-opacity)

"circle-opacity": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### circle-pitch-alignment[](#circle-pitch-alignment)

"circle-pitch-alignment": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>

### circle-pitch-scale[](#circle-pitch-scale)

"circle-pitch-scale": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>

### circle-radius[](#circle-radius)

"circle-radius": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### circle-stroke-color[](#circle-stroke-color)

"circle-stroke-color": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<[Color](https://docs.maptiler.com/sdk-js/api-reference/classes/Color/)\>

### circle-stroke-opacity[](#circle-stroke-opacity)

"circle-stroke-opacity": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### circle-stroke-width[](#circle-stroke-width)

"circle-stroke-width": [DataDrivenProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataDrivenProperty/)<number\>

### circle-translate[](#circle-translate)

"circle-translate": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<\[number, number\]\>

### circle-translate-anchor[](#circle-translate-anchor)

"circle-translate-anchor": [DataConstantProperty](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DataConstantProperty/)<"map" | "viewport"\>