Transforming Thomas J Bradley's signature pad JSON into a PNG file using C# programming language

I have been experimenting with the Signature Pad plugin developed by Thomas J Bradley and successfully converted JSON signature to PNG using PHP. Now I am looking to achieve the same result using C#.

There is a supplemental class called SignatureToImageDotNet available for this purpose, however, I have encountered difficulties in getting it to work. I must mention that I am relatively new to ASP.NET / C#. At this point, I have set up a website in Webmatrix, implemented the signature capture form, and managed to receive the JSON output on a page, but I am struggling to convert it into a PNG image. While I have created an 'App_Code' folder and placed the 'SignatureToImage.cs' file inside it, I am uncertain about how to call it.

I believe that someone with experience in ASP.NET / C# would find this task simple, and I am hopeful that either someone has previously accomplished this or could provide guidance on how to do it effectively, given that the documentation available is quite concise.

javascriptasp.netjsonwebmatrix

Answer №1

Great job on creating the App_Code folder, that's a step many people overlook. When it comes to calling classes in ASP.NET Web Pages, it's similar to PHP. You simply create a code block at the top of your cshtml page, which will run when the page loads:

http://www.asp.net/web-pages/tutorials/introducing-aspnet-web-pages-2/getting-started

Based on what else is happening in your request (more info or code would help), you should be able to start using the SignatureToImage class within a razor block at the top of your page:

default.cshtml

@{
     if (IsPostback) {
         var sigToImg = new SignatureToImage();
         var signatureImage = sigToImg.SigJsonToImage(signatureJson);
         // do something with the image!
     }
 }

<html>
....

I understand this answer may leave room for more questions, so please don't hesitate to ask about how Web Pages and C# work if you need more specific guidance.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Leverage Jackson library for handling requests from Ember JSON API

Currently, I am utilizing Ember for constructing the client application while employing a Java Servlet backend with Jackson to handle the calls. The structure of the create customer call from Ember resembles the following: { "customer":{ "na ...

javajsonember.jsjacksonservlet-3.0

What steps can I take to troubleshoot the 'Uncaught DOMException: failed to execute add on DOMTokenList' error?

I am looking to create media icons <div class="contact"> <span> <i class="fa fa-phone"></i> </span> <span> <i class="fa fa-facebook"></i> </spa ...

javascripthtml

After reducing the size of the table, the data spills over

Hey there, amazing individuals of the internet! Hope you're all doing well today. I've encountered a rather perplexing issue that's got me stumped. So, here's the situation - I have this table full of data and I want it to initially be ...

javascripthtmljquerycss

Experience the magic of a customized cursor that disappears with a simple mouse movement in your website,

I have been experimenting with designing a custom cursor for my website. After finding a design I liked, I made some adjustments to suit my needs. However, an issue I encountered is that when I scroll, the custom cursor also moves away from its original po ...

javascripthtmlcsscursor

"Converting JSONObject to JSONArray or vice versa in Android results in the addition of unnecessary backslashes to the JSON Array

When I create a JSON object and add it to a JSON array, it seems to add extra backslashes :/ 1) Creating JSONObject JSONObject newObj = new JSONObject(); newObj.put("TaskName", "Check - Task Name"); newObj.put("TaskStatus", "Compl ...

javaandroidarraysjson

React eliminates all white spaces

Presented here is a compilation of various span elements: <span>1</span> <span>2</span> <span>3</span> <span>4</span> <span>5</span> Accompanied by the CSS style for these elements: span{ bac ...

javascriptcssreactjs

Managing ajax requests timeouts while abiding by the browser's connection limitations

Encountering an issue with ajax requests and fixed timeouts, I've resorted to using this straightforward code snippet: $.ajax({ url: "test.html", error: function(){ //do something }, success: function(){ //do something ...

javascriptjqueryajax

Halt the execution of a function upon clicking a div element

I'm currently working on a function that needs to be stopped when a div with the class "ego" is clicked. This function toggles the visibility of the header based on the scroll position and should only run by default. Below is the code snippet: $("#e ...

javascriptjqueryhtmlcss

What is the process for including a new item in an array of objects?

const data = [ { title: 'Tasks', items: ['complete assignments', 'study for exams'], }, { title: 'Ongoing', items: ['learn new skills', 'work on projects'], }, { titl ...

javascriptarraysreactjsobject

Error: foobar is not defined within this scope (anonymous function)

I'm facing an issue with a JavaScript file hosted on a domain called foobar.com. at http://foobar.com/static/js/main.js: $(document).ready(function() { function foobar(bar){ $.ajax({ url: "/site/foo/", ...

javascriptjqueryajax

The issue of Ng-Route not functioning properly on a Node/Express static server

I need assistance with my app.js file that currently directs all requests to pages/index.html. Now I am attempting to utilize Angular to route user requests for '/#/media' by adding the following code: academy.config(function($routeProvider) { ...

javascriptangularjsnode.jsexpress

Utilize Set.Attribute prior to entering the for loop

Could someone please clarify why I am unable to declare the var node before the for loop and then simply use appendChild(node) inside the loop? Why is it necessary to declare it for each iteration in order for it to affect all div elements? Otherwise, it w ...

javascript

Anchor checkboxes

I am dealing with a large number of checkboxes that are linked to anchors. Whenever a checkbox is clicked, it navigates to the corresponding anchor on the same page. Is there a more efficient way to implement this? With around 50 checkboxes, my current cod ...

javascripthtml

Error Message: Unexpected character "C" found in JSON response from Ionic 2 Http GET request

Trying to execute a GET request and extract data from the response. this.http.get('http://localhost:8888/maneappback/more-items.php').subscribe(res => { console.log(res.json()); }, (err) => { console.log(err); }); An error message ...

javascriptphpjsonangularionic-framework

What is the process for retrieving all elements from a LINQ query?

I'm currently in the process of testing the relationships in my database using Entity Framework. I'm facing an issue with retrieving all elements from a LINQ query. The scenario is that I have a table called Web_Profiles which has a many-to-many ...

c#asp.netentity-frameworklinq

Position items within the dynamically generated div without appending them

Utilizing JavaScript, I dynamically generate a line but struggle to position two balls at both the 1/3 mark from the beginning and end. For reference, please view the image below. I aim to have two balls appear upon pressing enter in the input box. Despite ...

javascripthtmlcss

Is there a more efficient method to achieve the desired effect without making multiple calls to jQuery ajaxSuccess?

Currently, I am working on creating an effect that involves a quick fade-out followed by a fade-in of the element once the request is successful. Since jQuery processes elements in a routine manner (top to bottom), I have managed to achieve my desired eff ...

javascriptjqueryajaxjquery-ui

Tips for automatically refreshing a Gridview using a Timer in asp.net

I'm looking to update my gridview automatically using a timer, similar to live data functionality. Despite no errors being shown, the gridview is not refreshing automatically as intended. Any suggestions on how I can achieve live data-like updates f ...

c#asp.net

Obtaining values from event listeners in Vue.js across different methods

Looking for guidance on the code snippet provided below. Is there a way to assign the value of "e.detail.name" to "nodeName," and then access it in a different method within the component for an API request? data() { return { nodeName: '' ...

javascriptnode.jsvue.jsvue-component

Is there a way to verify if an ID includes more than one word?

I am trying to target a specific div with a unique id in jQuery: <div id="picture_contents_12356_title"></div> The '12356' is autogenerated and must be included in the id. I need to create a jQuery selector that combines "picture_co ...

javascriptjqueryhtmlcss