Skip to main content

HTML Canvas To Image

HTML 5 is one of the hot topics in Web Development, because it introduced many new tags..
You can get more information about new tags in HTML 5 at here.
This post is about how can you generate image from Canvas tag in HTML 5.





Though there are some of the JavaScript Libraries on web which can generate image from canvas, I am posting the way which I think is very easy to create an image from canvas.
From http://www.w3.org
url = canvas . toDataURL( [ type, ... ])

Returns a data: URL for the image in the canvas.
The first argument, if provided, controls the type of the image to be returned (e.g. PNG or JPEG). The default is image/png; that type is also used if the given type isn't supported. The other arguments are specific to the type, and control the way that the image is generated, as given in the table below.

Using toDataURL and window.open method we can generate image from canvas element.
Following code does it for you-
var canvas=document.getElementById("canvasID");
window.open(canvas.toDataURL());
Simple, isn't it?

Comments

Popular posts from this blog

Java Tools Plugin for Notepad++

This post and the plugin is outdated. Please use plugin from this link which is updated and allows customization of shortcut key mappings and much more . Notepad++ is a great free editor. I like notepad++ because its a light weight editor and loads instantly. I use notepad++ for editing many files everyday. One plugin I always wanted was a plugin which lets me compile my java files and execute them from editor itself, but I couldn't find it so I wrote a myself. This plugin can be downloaded from  this link . I am working on this plugin to make it more effective, so that if user have more than one installations of JDK or JRE then user should be able to choose which one to use etc. This is a simple plugin which has two commands- Compile - compiles a java file. Run - executes a java file. For using this plugin Java must be installed on the system.

Encrypt Decrypt data using AES in Java

AES stands for Advanced Encryption Standard. AES is an Symmetric Key Algorithm, that means key used for encrypting the data, same key will be used for  decryption of  the encrypted data. This algorithm supplants DES algorithm. This post shows how to use AES algorithm in Java to encrypt and decrypt data. Encrypting Data- import java.security.GeneralSecurityException; import javax.crypto.Cipher; import javax.crypto.KeyGenerator; import javax.crypto.SecretKey; public class AESTest1 { public static void main(String[] args) throws GeneralSecurityException { KeyGenerator keyGenerator = KeyGenerator.getInstance("AES"); keyGenerator.init(128); SecretKey key = keyGenerator.generateKey(); Cipher cipher = Cipher.getInstance("AES"); cipher.init(Cipher.ENCRYPT_MODE, key); byte encryptedData[] = cipher.doFinal(args[0].getBytes()); } } In above example we have used KeyGenerator class, which generates key for encrypting data, as we are using...

Java Tools Plugin for Notepad++ Update

This post and the plugin is outdated. Please use plugin from  this link  which is updated and allows customization of shortcut key mappings and much more . This post is regarding the update for Notepad++ plugin which I wrote to use compile and execute Java programs from the Notepad++ editor itself. I have updated the plugin so that user can customize the shortcut keys assigned for compiling and executing the programs. Following image shows simple Settings dialog where you can customize the shortcut keys mapping. Although user can customize the keys but to apply them Notepad++ must be restarted. Well, I tried but in Notepad++, there is no way to change mapping after initialization process of plugin.. Click here to download the plugin.