React VectorMap - background

Specifies the properties for the map background.

Selector: Background
Type:

Object

The map background is a space on a map that does not contain areas. Within the background configuration object, you can specify colors for the map background and its border.

jQuery
index.js
$('#vectorMap').dxVectorMap({
    // ...
    background: {
        color: "azure",
        borderColor: "blue",
    },
})
Angular
app.component.html
<dx-vector-map ... >
    <dxo-background color="azure" borderColor="blue"></dxo-background>
</dx-vector-map>
Vue
App.vue
<template>
    <DxVectorMap ... >
        <DxBackground color="azure" borderColor="blue" />
    </DxVectorMap>
</template>

<script setup lang="ts">
import { DxVectorMap, DxBackground } from 'devextreme-vue/vector-map';

</script>
React
App.tsx
import { VectorMap, Background } from 'devextreme-react/vector-map';

function App() {
    return (
        <VectorMap ... >
            <Background color="azure" borderColor="blue" />
        </VectorMap>
    )
}

borderColor

Specifies a color for the background border.

Type:

String

Default Value: '#cacaca'

This property supports the following colors:

color

Specifies a color for the background.

Type:

String

Default Value: '#ffffff'

This property supports the following colors: