Re: How to retrieve data as byte[] in GWT from getImageData
On 4 mar, 06:10, Kevin Tarn kevn.t...@gmail.com wrote: Unfortunately, using JsArrayInteger is very slow: public byte[] getBitmap() { // String str = getImageData(0, 0, width, height); // byte[] ar = new byte[str.length()]; // for (int i=0; iar.length; i++) // ar[i] = (byte)((int)str.charAt(i) 0xff); // return ar; JsArrayInteger ja = getImageRawData(0, 0, width, height); int len = ja.length(); byte[] ar = new byte[len]; for (int i=0; ilen; i++) ar[i] = (byte)(ja.get(i) 0xff); return ar; } The loop above copying element to a byte array is 10 times above than the commented codes. Anything doing wrong? If you're comparing runs in hosted mode, it doesn't really surprise me, as JsArrayInteger will go back and forth from Java to JavaScript. But once compiled into JS it should run (almost) at the same speed. Now, it also depends how getImageRawData has been changed to return a JsArrayInteger instead of a String... --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
According to the WhatWG spec for canvas, getImageData() returns a CavasPixelArray, which is an array of bytes. What if you created a JavaScriptObject to represent it? Does GWT thunk to bytes across the JSNI boundary OK? I know it won't pass arrays of anything back, but individual elements maybe: import com.google.gwt.core.client.JavaScriptObject; public class CanvasPixelArray extends JavaScriptObject { protected CanvasPixelArray() { //required by GWT } public native int getLength() /*-{ return this.length; }-*/; public native byte getPixelByte(int pos) /*-{ return this[pos]; }-*/; } //then, create one in your code: public byte[] getBitmap(Element canvasElement, int left, int top, int width, int height) { //then, create one in your code: CanvasPixelArray cpa = getCPA(canvasElement, left, top, width, height); byte[] pixelBytes = new byte[cpa.length()]; for (int i = 0; i cpa.length(); i++) { pixelBytes[i] = cpa.getPixelByte(i); } return pixelBytes; } private native CanvasPixelArray getCPA(Element canvas, int sx, int sy, int sw, int sh) /*-{ return canvas.getContext(2d).getImageData(sx, sy, sw, sh); }-*/; --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
This is pretty cool. You should try converting the data in GWT instead of JSNI. It could go straight to bytes, or at least it could take advantage of GWT's StringBuilder speed. On Mar 1, 4:57 pm, Kevin Tarn kevn.t...@gmail.com wrote: Forgot to tell: getImageData method convert raw data to a Windows DIB format. Kevin On Mon, Mar 2, 2009 at 8:52 AM, Kevin Tarn kevn.t...@gmail.com wrote: I got idea from canvas2image.js(http://www.nihilogic.dk/labs/canvas2image/). So I wrote a JSNI methods as below: public native String getImageData(int left, int top, int width, int height) /*-{ var oData = th...@com.messenger.client.framework.canvas::context.getImageData(left, top, width, height); var aImgData = oData.data; var strPixelData = ; var y = height; var iPadding = (4 - ((width * 3) % 4)) % 4; do { var iOffsetY = width*(y-1)*4; var strPixelRow = ; for (var x=0;xwidth;x++) { var iOffsetX = 4*x; if (aImgData[iOffsetY+iOffsetX+2] == 0 aImgData[iOffsetY+iOffsetX+1] == 0 aImgData[iOffsetY+iOffsetX] == 0) { strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); } else { strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+2]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+1]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX]); } } for (var c=0;ciPadding;c++) { strPixelRow += String.fromCharCode(0); } strPixelData += strPixelRow; } while (--y); return strPixelData; }-*/; As above method, I got a raw data in String object. So I need another method to convert it to byte array. Here it is: public byte[] getBitmap() { String str = getImageData(0, 0, width, height); byte[] ar = new byte[str.length()]; for (int i=0; iar.length; i++) ar[i] = (byte)((int)str.charAt(i) 0xff); return ar; } Hope this is helpful. Kevin On Sat, Feb 28, 2009 at 10:41 PM, Fabrício Cabral fabrici...@gmail.comwrote: Could you say how you solved this problem? For historic purpose... Thanks in advance! I have solved problem. Kevin -- --fx --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
On 3 mar, 23:47, Kevin Tarn kevn.t...@gmail.com wrote: Yes. That's what I like to do. Could you give an example of retreiving canvas raw data by GWT instead of JSNI? Get our JSNI methods the shorter you can. Here, just make it get oData.data and return it as a JsArrayNumber; then do all the following in Java, with aImgData being the JsArrayNumber. My guess is that you could turn it directly to bytes as the array length could be computed early from width+height. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
Unfortunately, using JsArrayInteger is very slow: public byte[] getBitmap() { //String str = getImageData(0, 0, width, height); //byte[] ar = new byte[str.length()]; //for (int i=0; iar.length; i++) //ar[i] = (byte)((int)str.charAt(i) 0xff); //return ar; JsArrayInteger ja = getImageRawData(0, 0, width, height); int len = ja.length(); byte[] ar = new byte[len]; for (int i=0; ilen; i++) ar[i] = (byte)(ja.get(i) 0xff); return ar; } The loop above copying element to a byte array is 10 times above than the commented codes. Anything doing wrong? Kevin On Wed, Mar 4, 2009 at 6:58 AM, Thomas Broyer t.bro...@gmail.com wrote: On 3 mar, 23:47, Kevin Tarn kevn.t...@gmail.com wrote: Yes. That's what I like to do. Could you give an example of retreiving canvas raw data by GWT instead of JSNI? Get our JSNI methods the shorter you can. Here, just make it get oData.data and return it as a JsArrayNumber; then do all the following in Java, with aImgData being the JsArrayNumber. My guess is that you could turn it directly to bytes as the array length could be computed early from width+height. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
I got idea from canvas2image.js(http://www.nihilogic.dk/labs/canvas2image/). So I wrote a JSNI methods as below: public native String getImageData(int left, int top, int width, int height) /*-{ var oData = th...@com.messenger.client.framework.canvas::context.getImageData(left, top, width, height); var aImgData = oData.data; var strPixelData = ; var y = height; var iPadding = (4 - ((width * 3) % 4)) % 4; do { var iOffsetY = width*(y-1)*4; var strPixelRow = ; for (var x=0;xwidth;x++) { var iOffsetX = 4*x; if (aImgData[iOffsetY+iOffsetX+2] == 0 aImgData[iOffsetY+iOffsetX+1] == 0 aImgData[iOffsetY+iOffsetX] == 0) { strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); } else { strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+2]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+1]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX]); } } for (var c=0;ciPadding;c++) { strPixelRow += String.fromCharCode(0); } strPixelData += strPixelRow; } while (--y); return strPixelData; }-*/; As above method, I got a raw data in String object. So I need another method to convert it to byte array. Here it is: public byte[] getBitmap() { String str = getImageData(0, 0, width, height); byte[] ar = new byte[str.length()]; for (int i=0; iar.length; i++) ar[i] = (byte)((int)str.charAt(i) 0xff); return ar; } Hope this is helpful. Kevin On Sat, Feb 28, 2009 at 10:41 PM, Fabrício Cabral fabrici...@gmail.comwrote: Could you say how you solved this problem? For historic purpose... Thanks in advance! I have solved problem. Kevin -- --fx --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
Forgot to tell: getImageData method convert raw data to a Windows DIB format. Kevin On Mon, Mar 2, 2009 at 8:52 AM, Kevin Tarn kevn.t...@gmail.com wrote: I got idea from canvas2image.js(http://www.nihilogic.dk/labs/canvas2image/). So I wrote a JSNI methods as below: public native String getImageData(int left, int top, int width, int height) /*-{ var oData = th...@com.messenger.client.framework.canvas::context.getImageData(left, top, width, height); var aImgData = oData.data; var strPixelData = ; var y = height; var iPadding = (4 - ((width * 3) % 4)) % 4; do { var iOffsetY = width*(y-1)*4; var strPixelRow = ; for (var x=0;xwidth;x++) { var iOffsetX = 4*x; if (aImgData[iOffsetY+iOffsetX+2] == 0 aImgData[iOffsetY+iOffsetX+1] == 0 aImgData[iOffsetY+iOffsetX] == 0) { strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); strPixelRow += String.fromCharCode(255); } else { strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+2]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX+1]); strPixelRow += String.fromCharCode(aImgData[iOffsetY+iOffsetX]); } } for (var c=0;ciPadding;c++) { strPixelRow += String.fromCharCode(0); } strPixelData += strPixelRow; } while (--y); return strPixelData; }-*/; As above method, I got a raw data in String object. So I need another method to convert it to byte array. Here it is: public byte[] getBitmap() { String str = getImageData(0, 0, width, height); byte[] ar = new byte[str.length()]; for (int i=0; iar.length; i++) ar[i] = (byte)((int)str.charAt(i) 0xff); return ar; } Hope this is helpful. Kevin On Sat, Feb 28, 2009 at 10:41 PM, Fabrício Cabral fabrici...@gmail.comwrote: Could you say how you solved this problem? For historic purpose... Thanks in advance! I have solved problem. Kevin -- --fx --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
Could you say how you solved this problem? For historic purpose... Thanks in advance! I have solved problem. Kevin -- --fx --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---
Re: How to retrieve data as byte[] in GWT from getImageData
I have solved problem. Kevin On Thu, Feb 26, 2009 at 12:45 AM, Kevin Tarn kevn.t...@gmail.com wrote: I have a canvas widget. I want to use JSNI to get canvas bitmap by getImageData method. Is there a way to return getImageData output to Java byte[]? Kevin --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To post to this group, send email to Google-Web-Toolkit@googlegroups.com To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~--~~~~--~~--~--~---