How to add defs g in svg, using C# code in blazor webasssembly

I want to insert a <defs><g> tag in an SVG using C# code in a Blazor WebAssembly Razor file, but it's not working. I used RenderFragment to add a simple <rect>; by clicking on the SVG, it works. However, when I try to add <defs><g> using the same method, it fails. In the browser's debug mode, it appears correct, but the <defs><g> won't display. Here is my code:

@using BlazorSvgApp.Client.Model@rendermode InteractiveWebAssembly<svg class="station" width="800" height="600" tab-index="0" @onmouseup="OnSvgMouseUp"><defs><g id="combinedGraphic"><rect width="16" height="16" x="00" y="0" fill="green" /><circle cx="28" cy="8" r="8" fill="green" /></g></defs>    @for (int i = 0; i < _fragments.Count; i++)    {        @_fragments[i](_models[i])    }<use xlink:href="#combinedGraphic" x="100" y="100"/><use xlink:href="#combinedGraphic" x="100" y="200"/><use xlink:href="#combinedGraphic" x="100" y="300"/></svg>@code {    private readonly List<RenderFragment<GraphicModel>> _fragments = new();    private readonly List<GraphicModel> _models = new();    private void OnSvgMouseUp(MouseEventArgs e)    {        var graphicModel = new GraphicModel { X = e.OffsetX, Y = e.OffsetY };        var rectModel = new GraphicModel { X = e.OffsetX + 50, Y = e.OffsetY };        RenderFragment<GraphicModel> fragment = model =>@<use xlink:href="#combinedGraphic" x="@model.X" y="@model.Y" />;        RenderFragment<GraphicModel> fragment1 = model =>@<rect width="16" height="16" fill="green" x="@model.X" y="@model.Y" />;        _models.Add(graphicModel);        _fragments.Add(fragment);        _models.Add(rectModel);        _fragments.Add(fragment1);    }}

And here is the elements in browser:enter image description here

When I move the mouse over elements, the <use> tag for the created elements displays "0,0", which I believe is the source of the issue.enter image description here