BlazorExtensions / Canvas

HTML5 Canvas API implementation for Microsoft Blazor
MIT License
602 stars 145 forks source link

MeasureText have only width informations #132

Open Noeilnoeil17 opened 1 year ago

Noeilnoeil17 commented 1 year ago

Hi everybody,

Enjoy with this extensions, thanks a lot When i try to use _context.MesureTextAsync, only width parameter is present, all other return 0 :-(

just tested with this simple test :

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    this._context = await this._canvasReference.CreateCanvas2DAsync();
    await this._context.SetFillStyleAsync("green");

    await this._context.FillRectAsync(10, 100, 100, 100);

    await this._context.SetFontAsync("48px serif");
    await this._context.StrokeTextAsync("Hello Blazor!!!", 10, 100);

    **var size = await this._context.MeasureTextAsync("48px serif");**

}

image

Any help is welcome, thanks,

Noeilnoeil17

bigDave1357 commented 1 year ago

Me too on this. Changing fonts, changing font sizes, nothing seems to change the results - all zeros except for the width and that value never changes regardless of the length of text, the font etc.

Noeilnoeil17 commented 1 year ago

Hi bigDave1357, thanks for your feedback, for now, only solution is using javascript...

function measuretextincanvas(font, text, mmToPix) { var canvas = document.getElementById('hiddencanvas'); var ctx = canvas.getContext('2d'); ctx.font = font; var TextWidth = ctx.measureText(text).width / mmToPix; var TextHeight = ctx.measureText("H").actualBoundingBoxAscent / mmToPix; return { TextWidth, TextHeight }; }

Noeilnoeil17

bigDave1357 commented 1 year ago

Hi @Noeilnoeil17, thanks for your assistance. I figured the same. My app needs to manipulate font sizes based on an auto-fit scenario as well as render lots of text, and I suspect I'll be better just using JS for the whole solution. Seems pointless that I have an extension for part of the work if I have to reach down into JS anyway. Kind of defeats the purpose of the extension. I'll probably get better performance working directly with JS anyway. So I'll ditch the extension.

JaromirBedkowski commented 1 year ago

Hi @bigDave1357 - could You help me to start with JS without this Extension ?