diff --git a/KB-Samples/HTMLShapeExportInWASM/Pages/Index.razor b/KB-Samples/HTMLShapeExportInWASM/Pages/Index.razor index 9256f2c2..b249f06b 100644 --- a/KB-Samples/HTMLShapeExportInWASM/Pages/Index.razor +++ b/KB-Samples/HTMLShapeExportInWASM/Pages/Index.razor @@ -14,24 +14,24 @@ @using Syncfusion.PdfExport;
- + - - + + @{ - Node node1 = (context as Node); - string Name = (node1.Data as HierarchicalDetails).Name; - string Role = (node1.Data as HierarchicalDetails).Designation; - string Imageurl = (node1.Data as HierarchicalDetails).BG; - if (Name == "Maria Anders") + Node node = context as Node; + string name = (node.Data as HierarchicalDetails).Name; + string role = (node.Data as HierarchicalDetails).Designation; + string imageUrl = (node.Data as HierarchicalDetails).BG; + if (name == "Maria Anders") {
+ background-size: 100% 100%;background-image: url(@( @imageUrl));">
@Name@name@Role + letter-spacing: 0;" class="e-orgchart-role-div">@role
} - else if (Name == "Miguel Angel Paolino") + else if (name == "Miguel Angel Paolino") {
+ background-size: 100% 100%;background-image: url(@( @imageUrl));">
@Name@name@Role + letter-spacing: 0;" class="e-orgchart-role-div">@role
+ background-size: 100% 100%;background-image: url(@( @imageUrl));">
@Name@name@Role + letter-spacing: 0;" class="e-orgchart-role-div">@role
+ background-size: 100% 100%;background-image: url(@(@imageUrl));">
@Name@name@Role + letter-spacing: 0;" class="e-orgchart-role-div">@role
("exportToImage", diagram.ID); } private async void SVGExport() { @@ -329,11 +329,11 @@ FitToPage = false, Margin = new DiagramThickness() { Bottom = 0, Left = 0, Right = 0, Top = 0 }, }; - await Diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, options); + await diagram.ExportAsync("Diagram", DiagramExportFormat.SVG, options); } private async Task ExportDiagram() { - string image = await JS.InvokeAsync("exportToPdf", Diagram.ID); + string image = await JS.InvokeAsync("exportToPdf", diagram.ID); string[] images = new string[] { image }; await ExportToPdf("diagram", PdfPageOrientation.Portrait, true, images); } @@ -342,7 +342,7 @@ PdfDocument document = new PdfDocument(); document.PageSettings.Orientation = orientation; document.PageSettings.Margins = new PdfMargins() { Left = 0, Right = 0, Top = 0, Bottom = 0 }; - DiagramRect bounds = await JS.InvokeAsync("getDiagramBounds", Diagram.ID); + DiagramRect bounds = await JS.InvokeAsync("getDiagramBounds", diagram.ID); document.PageSettings.Height = (float)bounds.Height; document.PageSettings.Width = (float)bounds.Width; diff --git a/KB-Samples/HTMLShapeExportInWASM/wwwroot/script.js b/KB-Samples/HTMLShapeExportInWASM/wwwroot/script.js index d91c65ec..e1319f40 100644 --- a/KB-Samples/HTMLShapeExportInWASM/wwwroot/script.js +++ b/KB-Samples/HTMLShapeExportInWASM/wwwroot/script.js @@ -19,38 +19,38 @@ window.download = function download(image) { window.exportToImage = async function (elementId) { var image = ""; - const original1 = document.getElementById(elementId + '_diagramLayer_div'); - const original2 = document.getElementById(elementId + '_htmlLayer'); - const clone1 = original1.cloneNode(true); - const clone2 = original2.cloneNode(true); - clone1.appendChild(clone2); - const tempContainer = document.createElement('div'); - tempContainer.style.position = 'absolute'; - tempContainer.style.left = '-9999px'; - tempContainer.style.top = '-9999px'; - tempContainer.appendChild(clone1); - document.body.appendChild(tempContainer); - await html2canvas(clone1).then(canvas => image = canvas.toDataURL("image/png")); + const diagramLayerElement = document.getElementById(elementId + '_diagramLayer_div'); + const htmlLayerElement = document.getElementById(elementId + '_htmlLayer'); + const clonedDiagramLayer = diagramLayerElement.cloneNode(true); + const clonedHtmlLayer = htmlLayerElement.cloneNode(true); + clonedDiagramLayer.appendChild(clonedHtmlLayer); + const exportContainer = document.createElement('div'); + exportContainer.style.position = 'absolute'; + exportContainer.style.left = '-9999px'; + exportContainer.style.top = '-9999px'; + exportContainer.appendChild(clonedDiagramLayer); + document.body.appendChild(exportContainer); + await html2canvas(clonedDiagramLayer).then(canvas => image = canvas.toDataURL("image/png")); var link = document.createElement("a"); link.href = image; link.download = "diagram.png"; link.click(); } window.exportToPdf = async function (elementId) { - const original1 = document.getElementById(elementId + '_diagramLayer_div'); - const original2 = document.getElementById(elementId + '_htmlLayer'); - const clone1 = original1.cloneNode(true); - const clone2 = original2.cloneNode(true); - clone1.appendChild(clone2); - const tempContainer = document.createElement('div'); - tempContainer.style.position = 'absolute'; - tempContainer.style.left = '-9999px'; - tempContainer.style.top = '-9999px'; - tempContainer.appendChild(clone1); - document.body.appendChild(tempContainer); + const diagramLayerElement = document.getElementById(elementId + '_diagramLayer_div'); + const htmlLayerElement = document.getElementById(elementId + '_htmlLayer'); + const clonedDiagramLayer = diagramLayerElement.cloneNode(true); + const clonedHtmlLayer = htmlLayerElement.cloneNode(true); + clonedDiagramLayer.appendChild(clonedHtmlLayer); + const exportContainer = document.createElement('div'); + exportContainer.style.position = 'absolute'; + exportContainer.style.left = '-9999px'; + exportContainer.style.top = '-9999px'; + exportContainer.appendChild(clonedDiagramLayer); + document.body.appendChild(exportContainer); var image = ""; - await html2canvas(clone1).then(canvas => image = canvas.toDataURL("image/png")); - document.body.removeChild(tempContainer); + await html2canvas(clonedDiagramLayer).then(canvas => image = canvas.toDataURL("image/png")); + document.body.removeChild(exportContainer); return image; } diff --git a/KB-Samples/ImageExport/ImageExport/Components/Pages/Home.razor b/KB-Samples/ImageExport/ImageExport/Components/Pages/Home.razor index b5bb01af..2a2d89cc 100644 --- a/KB-Samples/ImageExport/ImageExport/Components/Pages/Home.razor +++ b/KB-Samples/ImageExport/ImageExport/Components/Pages/Home.razor @@ -2,7 +2,7 @@ @using Syncfusion.Blazor.BarcodeGenerator - + @@ -10,7 +10,7 @@ @code { - private SfQRCodeGenerator QRcode; + private SfQRCodeGenerator qrCode; private string base64Image; protected override void OnInitialized() { @@ -23,7 +23,7 @@ } private async void OnExport() { - QRcode.Export("QRCodeWithLogo", BarcodeExportType.JPG); + qrCode.Export("QRCodeWithLogo", BarcodeExportType.JPG); } } diff --git a/KB-Samples/UnselectSymbolInPalette/UnselectSymbolInPalette/Components/Pages/Home.razor b/KB-Samples/UnselectSymbolInPalette/UnselectSymbolInPalette/Components/Pages/Home.razor index d93cdae7..94e31434 100644 --- a/KB-Samples/UnselectSymbolInPalette/UnselectSymbolInPalette/Components/Pages/Home.razor +++ b/KB-Samples/UnselectSymbolInPalette/UnselectSymbolInPalette/Components/Pages/Home.razor @@ -33,29 +33,29 @@
- +
@code { - DiagramSize symbolDragPreviewSize; - public SfDiagramComponent Diagram; - SfSymbolPaletteComponent palette; - public DiagramObjectCollection palettes; - double symbolHeight = 65; - double symbolWidth = 65; - public DiagramObjectCollection basicShapes { get; set; } + private DiagramSize symbolDragPreviewSize; + private SfDiagramComponent diagram; + private SfSymbolPaletteComponent palette; + private DiagramObjectCollection palettes; + private double symbolHeight = 65; + private double symbolWidth = 65; + private DiagramObjectCollection basicShapes { get; set; } [Inject] - protected IJSRuntime jsRuntime { get; set; } + protected IJSRuntime JsRuntime { get; set; } protected override async Task OnAfterRenderAsync(bool firstRender) { await base.OnAfterRenderAsync(firstRender); palette.Targets = new DiagramObjectCollection { - Diagram + diagram }; }