How to add Image node in Symbol palette in Blazor

1 min read

In the Blazor diagram, you can host the images in the Symbol Palette. So, hosting the custom objects like Image or Textbox in the Symbol Palette can be achieved using the node. The Source property of the node will assist you to set an image reference path and the type property of the node sets the type of the shape

Refer to the following code example to learn how to show images in the Symbol Palette:

// Creates a collection for nodes
public ObservableCollection<DiagramNode> basicShapes { get; set; } = new ObservableCollection<DiagramNode>();
//…
        DiagramNode Imagenode = new DiagramNode()
        {
            Id = "Image",
            Height = 100,
            Width = 100,
            Shape = new DiagramShape() { Type = Syncfusion.Blazor.Diagrams.Shapes.Image, Source = "https://www.syncfusion.com/content/images/nuget/sync_logo_icon.png" }
        };
// Adds Image into the basic shapes collection
        basicShapes.Add(Imagenode);

Sample link :

https://www.syncfusion.com/downloads/support/directtrac/283773/ze/HTML-Node1121046392

How to add Image node in Symbol palette in Blazor

Access denied