---
title: "MaptilerARControlOptions | Augmented reality | JavaScript maps SDK"
description: "Documentation for AR Control"
---

> 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 MaptilerARControlOptions

Options for the Maptiler AR Control

type MaptilerARControlOptions \= {  
    [activateAR](#activatear)?: boolean;  
    [arButtonClassName](#arbuttonclassname)?: string;  
    [arButtonContent](#arbuttoncontent)?: string | HTMLElement;  
    [background](#background)?: string;  
    [closeButtonClassName](#closebuttonclassname)?: string;  
    [closeButtonContent](#closebuttoncontent)?: string | HTMLElement;  
    [edgeColor](#edgecolor)?: string;  
    [highRes](#highres)?: false;  
    [logo](#logo)?: string;  
    [logoClass](#logoclass)?: string;  
    [logoHeight](#logoheight)?: number;  
    [showButton](#showbutton)?: boolean;  
}

-   Defined in [src/MaptilerARControl.ts:192](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L192)

##### Index

### Properties

[activateAR?](#activatear) [arButtonClassName?](#arbuttonclassname) [arButtonContent?](#arbuttoncontent) [background?](#background) [closeButtonClassName?](#closebuttonclassname) [closeButtonContent?](#closebuttoncontent) [edgeColor?](#edgecolor) [highRes?](#highres) [logo?](#logo) [logoClass?](#logoclass) [logoHeight?](#logoheight) [showButton?](#showbutton)

## Properties

### `Optional`activateAR[](#activatear)

activateAR?: boolean

When the platform allows, setting this to `true` automatically activates the AR mode as soon as the data is ready. Quick Look on iOS is likely to allow this, while WebXR on Android is not likeley to. Default: `false`

-   Defined in [src/MaptilerARControl.ts:265](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L265)

### `Optional`arButtonClassName[](#arbuttonclassname)

arButtonClassName?: string

CSS class to add to the AR button on the AR modal. If none is provided, a default inline style is added. Default: none

-   Defined in [src/MaptilerARControl.ts:224](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L224)

### `Optional`arButtonContent[](#arbuttoncontent)

arButtonContent?: string | HTMLElement

Content to add to the AR button. If the content is a string, it is added as `.innerHTML` if it's a DOM element, it is added as `.appendChild()`. Default: `"Close"`

-   Defined in [src/MaptilerARControl.ts:231](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L231)

### `Optional`background[](#background)

background?: string

Background color (css compatible). Default: `"#FFFFFF"` (white)

-   Defined in [src/MaptilerARControl.ts:203](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L203)

### `Optional`closeButtonClassName[](#closebuttonclassname)

closeButtonClassName?: string

CSS class to add to the close button on the AR modal. If none is provided, a default inline style is added. Default: none

-   Defined in [src/MaptilerARControl.ts:210](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L210)

### `Optional`closeButtonContent[](#closebuttoncontent)

closeButtonContent?: string | HTMLElement

Content to add to the close button. If the content is a string, it is added as `.innerHTML` if it's a DOM element, it is added as `.appendChild()`. Default: `"Close"`

-   Defined in [src/MaptilerARControl.ts:217](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L217)

### `Optional`edgeColor[](#edgecolor)

edgeColor?: string

Color of the 3D model edges. Default: `"#0eaeff"` (grayish teal)

-   Defined in [src/MaptilerARControl.ts:237](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L237)

### `Optional`highRes[](#highres)

highRes?: false

Generate a mesh with a higher resolution texture. Default: `false`

-   Defined in [src/MaptilerARControl.ts:271](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L271)

### `Optional`logo[](#logo)

logo?: string

The URL to a logo image to be placed on top of the 3D view (in browser). The image is located by default on the bottom-left corner but this can be changed with the option `.logoClass`. Default: `""` (empty string, no image)

-   Defined in [src/MaptilerARControl.ts:245](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L245)

### `Optional`logoClass[](#logoclass)

logoClass?: string

CSS class to add to the logo image specified with the `.logo` option. If a CSS class is provided, the option `.logoHeight` will be ignored and the class is expected to include instruction about `width` and/or `height`. Default: `""` (empty string, no class spacified)

-   Defined in [src/MaptilerARControl.ts:259](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L259)

### `Optional`logoHeight[](#logoheight)

logoHeight?: number

Height in pixel of the logo. Default: `60`

-   Defined in [src/MaptilerARControl.ts:251](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L251)

### `Optional`showButton[](#showbutton)

showButton?: boolean

Shows the AR button if `true`, hide it otherwise. Default: `true`

-   Defined in [src/MaptilerARControl.ts:197](https://github.com/maptiler/maptiler-ar-control/blob/50ea0ab9f5769eef2f89078bebb3618f29c1bda6/src/MaptilerARControl.ts#L197)