Skip to main content
A newer version of this page is available. .

DiagramCustomShape.BackgroundImageLeft Property

Specifies the left offset of the shape background image.

Namespace: DevExpress.Web.ASPxDiagram

Assembly: DevExpress.Web.ASPxDiagram.v20.2.dll

NuGet Package: DevExpress.Web

Declaration

[DefaultValue(typeof(decimal), "0")]
public decimal BackgroundImageLeft { get; set; }

Property Value

Type Default Description
Decimal "0"

A decimal number from 0 to 1.

Remarks

The BackgroundImageLeft property specifies the ratio of the shape background image’s left offset to the shape’s width. If the BackgroundImageLeft property is set to 0, the image’s left edge matches the shape’s left edge.

The absolute offset is calculated by multiplying the BackgroundImageLeft value by the shape’s width.

Online Demo

Diagram - Custom Shapes

Example

<dx:ASPxDiagram ID="Diagram" runat="server" Width="100%" Height="600px">
    <SettingsToolbox>
        <Groups>
            <dx:DiagramToolboxGroup Category="Custom" CustomCategoryName="hardware" Title="Hardware" />
        </Groups>
    </SettingsToolbox>
    <CustomShapes>
        <dx:DiagramCustomShape CategoryName="hardware" Type="internet" Title="Internet" 
        BackgroundImageUrl="../Content/customshapes/shapes/internet.svg" 
        BackgroundImageLeft="0.15" BackgroundImageTop="0" BackgroundImageWidth="0.7" BackgroundImageHeight="0.7"
        DefaultWidth="0.75" DefaultHeight="0.75" DefaultText="Internet" AllowEditText="false" 
        TextLeft="0" TextTop="0.7" TextWidth="1" TextHeight="0.3">
            <ConnectionPoints>
                <dx:DiagramShapeConnectionPoint Left="0.5" Top="0" />
                <dx:DiagramShapeConnectionPoint Left="0.9" Top="0.5" />
                <dx:DiagramShapeConnectionPoint Left="0.5" Top="1" />
                <dx:DiagramShapeConnectionPoint Left="0.1" Top="0.5" />
            </ConnectionPoints>
        </dx:DiagramCustomShape>
        ...
    </CustomShapes>
</dx:ASPxDiagram>

Diagram Custom Shapes

See Also