We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Number of pixels in a signature

Currently in my app, the user is allowed to just enter a few or even just one pixels as a signature.  I would like to prevent this and have some minimum number of pixels that they need to enter when signing.

I suggest that Syncfusion adds an API that will return the number of black pixels in the image and the total pixels so that we can make a judgement call about the signature.

3 Replies

YA YuvanShankar Arunagiri Syncfusion Team February 15, 2023 03:19 PM UTC

Hi Arthur,

Sorry for the delay. We have prepared the sample based on your requirement. Using the JS Invoke method, we can get transparent(empty space) of canvas as percentage using the below code snippet.



    <div class="e-sign-heading">

        <div class="e-btn-options">

            <SfButton id="open" CssClass="e-primary" @onclick="OnOpen">GetValidSign%</SfButton>



    <div class="e-sign-content">

        <SfSignature @ref="signature" style="width: 500px; height: 300px;"></SfSignature>





    private SfSignature signature;

    private async void OnOpen()


        double Pert = await JSRuntime.InvokeAsync<double>("GetValidSign");





        function GetValidSign() {

            var canvas = document.getElementsByClassName("e-signature")[0];

            const ctx = canvas.getContext("2d");

            const imageData = ctx.getImageData(0, 0, 500, 300);

            const nrOfPixels = imageData.data.length / 4; // rgba pixels

            let transparent = 0;

            for (let i = 3; i < imageData.data.length; i += 4) {

                transparent += imageData.data[i] ? 0 : 1;



            return (transparent / nrOfPixels * 100);



Get back to us if you need any further assistance on this. 


YuvanShankar A

Attachment: SignatureSample_195d3c33.zip

AB Arthur Butler February 16, 2023 06:59 AM UTC

Thank you.

YA YuvanShankar Arunagiri Syncfusion Team February 16, 2023 09:01 AM UTC

You are welcome, Arthur. Please get back to us if you need any further assistance on this.

If that post is helpful, please consider accepting it as the solution so that other members can locate it more quickly.

Live Chat Icon For mobile
Up arrow icon