Loading...
Canvas Background
The <Background /> component can only be used within the <XFlow /> component to function properly.
After importing the <Background /> component, you can set the canvas background of <XFlowGraph />.
<XFlow>...<Background color="#F2F7FA" /></XFlow>
Specify the background color of the canvas using the color property.
Add the image property to specify a background image for the canvas.
Set the repeat property to watermark to apply the background image as a watermark effect. You can use the angle property to control the rotation angle of the watermark.
| Parameter Name | Description | Type | Default Value |
|---|---|---|---|
| image | Background image URL | string | - |
| color | Background color, supports all CSS background-color properties | string | - |
| size | Background image size, supports all CSS background-size properties | string | - |
| position | Background image position, supports all CSS background-position properties | string | center |
| repeat | Background image repeat method, supports all CSS background-repeat properties as well as built-in properties watermark, flip-x, flip-y, flip-xy | string | no-repeat |
| angle | Watermark rotation angle, effective only when the repeat property is set to watermark | number | 20 |
| opacity | Background image opacity | number | 1 |
| quality | Background image quality | number | 1 |
