asp.net html5 canvas

Question

0.00/5 (No votes)

See more:

Hi Experts,

I have this html5 canvas and I wish to access it from the code-behind in order to Draw on it through C# code (because the drawing program is ready made in C#). So practically I just wish to have my program use the html5 canvas instead of its wpf panel to draw onto.

I am concerned with the speed at which the drawings will appear on the canvas since one is on server side and the other would be on client side right? I don't want to have any legs or delays. Kindly guide me in the right direction.

Thanks a lot,
Justin

Posted 12-Mar-12 1:59am

Jukatzu

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

E.F. Nijboer · Answer 1 · 2012-03-12T02:11:00

Solution 1

A html5 canvas is meant for client-side drawing. In your case you want to draw server-side and therefor don't need a html5 canvas. Have a look at the link how to dynamically create server-side images.
Create Dynamic Images in ASP.NET[^]

Good luck!

Posted 12-Mar-12 2:11am

E.F. Nijboer

Comments

Jukatzu 12-Mar-12 8:49am

I don't want to create images. This has to remain as editable as possible. And due to the extensive amount of data that has to be drawn I don't want to re-draw the whole image everytime. Ideally I keep the features of the canvas :s

E.F. Nijboer 12-Mar-12 10:49am

A html5 canvas results to an image. You draw on its canvas, but that is actually the same as you would using c#. It is simply impossible to draw on a html5 canvas directly from server-side c#. However, if you want to re-use your c# you might want to consider using silverlight instead of html5.

Sergey Alexandrovich Kryukov 12-Mar-12 11:48am

Good point, voted 5.
--SA

Jukatzu 12-Mar-12 13:17pm

but silverlight limits me to the device's capabilities...html5 canvas runs on all major browsers even tablets'. any more good suggestions? I need a very efficient medium since this is gonna be a collaborative whiteboard application.

Thanks a lot E.F. Nijiboer. Your comments are much appreciated.

E.F. Nijboer 13-Mar-12 4:31am

In that case you would really need to translate the functionality from c# to javascript in order to make it work on the client. Client and server are two separate environments that cannot control components directly. Silverlight and Flash are components that implement this kind of functionality. I think translating your c# to javascript shouldn't be to hard because you already have it working and know how to implement. You need to remember that c# needs a .net framework on the machine it is running on (which can provided by silverlight for your browser) and therefor can't run natively in your browser.

Jukatzu 13-Mar-12 5:10am

yes yes that is fine :) ok then I guess I'll have to convert the code to js. I am quite new to js...is it possible to load an API in it?

Thanks again

E.F. Nijboer 14-Mar-12 4:27am

The html5 canvas api is quite good by itself but of course there are some very good libraries for the html5 canvas to help out even more. Have a look at these links:
http://html5doctor.com/an-introduction-to-the-canvas-2d-api/
http://www.suburban-glory.com/blog?page=141
One of my favorites:
http://processingjs.org/

The nice thing with processingjs is that there is a java application you can use to write and test processing scripts with a lot of demo scripts included. This might however not be exactly what you are looking but just nice to have a look at.

ja928 · Answer 2 · 2012-09-12T11:37:00

Solution 2

I ran into the same issue, wanting to start with a drawing, but leave it editable for the user. Please see my answer to this in my open source suite of HTML5 controls. If it's not quite what you're looking for, please let me know what other features would make the canvas complete.

Posted 12-Sep-12 11:37am

ja928