toDataURL

Spiros_N_ — Sat, 07 Mar 2015 07:14:08 GMT

Hi,

I toDataURL function supported on a canvas for a crosswalk deployment ?
Do I need plugin ?

this code:

var ctx = document.getElementById('avatarCanvas').getContext('2d');
ar img = new Image();
img.src = url;
img.onload = function () {
ctx.drawImage(img,0,0);
    
alert( ctx.toDataURL('image/png') );

fails with "undefined" function

Canvas.toDataURL works fine

Barry_Johnson — Mon, 09 Mar 2015 17:39:18 GMT

Canvas.toDataURL works fine on Crosswalk. I use it three different places in my current project without difficulty. Are you saying your code works in the emulator or a webpage but not in your built app?

Barrett J.

Spiros_N_ — Mon, 09 Mar 2015 17:51:33 GMT

Barrett J.
Thanks thanks for your reply.

I got Undefined is not a function in emulator. I haven't tried it in build app yet/

Seems strange, as it

Barry_Johnson — Tue, 10 Mar 2015 00:29:47 GMT

Seems strange, as it (toDataURL) works fine in the emulator. I hate to ask, but are you sure your "sweetAlert" is defined globally? Or set a breakpoint the line before and inspect ctx to see what is there and in its prototype.

This is it the ctx

Spiros_N_ — Tue, 10 Mar 2015 11:23:14 GMT

Yes the alert is defined.

This is it the ctx :

ctx: CanvasRenderingContext2D
canvas: canvas#avatarCanvas
fillStyle: "#000000"
font: "10px sans-serif"
globalAlpha: 1
globalCompositeOperation: "source-over"
imageSmoothingEnabled: true
lineCap: "butt"
lineDashOffset: 0
lineJoin: "miter"
lineWidth: 1
miterLimit: 10
shadowBlur: 0
shadowColor: "rgba(0, 0, 0, 0)"
shadowOffsetX: 0
shadowOffsetY: 0
strokeStyle: "#000000"
textAlign: "start"
textBaseline: "alphabetic"
webkitImageSmoothingEnabled: true
__proto__: CanvasRenderingContext2D
arc: function arc() { [native code] }
arcTo: function arcTo() { [native code] }
beginPath: function beginPath() { [native code] }
bezierCurveTo: function bezierCurveTo() { [native code] }
clearRect: function clearRect() { [native code] }
clearShadow: function clearShadow() { [native code] }
clip: function clip() { [native code] }
closePath: function closePath() { [native code] }
constructor: function CanvasRenderingContext2D() { [native code] }
createImageData: function createImageData() { [native code] }
createLinearGradient: function createLinearGradient() { [native code] }
createPattern: function createPattern() { [native code] }
createRadialGradient: function createRadialGradient() { [native code] }
drawFocusIfNeeded: function drawFocusIfNeeded() { [native code] }
drawImage: function drawImage() { [native code] }
drawImageFromRect: function drawImageFromRect() { [native code] }
ellipse: function ellipse() { [native code] }
fill: function fill() { [native code] }
fillRect: function fillRect() { [native code] }
fillText: function fillText() { [native code] }
getContextAttributes: function getContextAttributes() { [native code] }
getImageData: function getImageData() { [native code] }
getLineDash: function getLineDash() { [native code] }
isPointInPath: function isPointInPath() { [native code] }
isPointInStroke: function isPointInStroke() { [native code] }
lineTo: function lineTo() { [native code] }
measureText: function measureText() { [native code] }
moveTo: function moveTo() { [native code] }
putImageData: function putImageData() { [native code] }
quadraticCurveTo: function quadraticCurveTo() { [native code] }
rect: function rect() { [native code] }
resetTransform: function resetTransform() { [native code] }
restore: function restore() { [native code] }
rotate: function rotate() { [native code] }
save: function save() { [native code] }
scale: function scale() { [native code] }
setAlpha: function setAlpha() { [native code] }
setCompositeOperation: function setCompositeOperation() { [native code] }
setFillColor: function setFillColor() { [native code] }
setLineCap: function setLineCap() { [native code] }
setLineDash: function setLineDash() { [native code] }
setLineJoin: function setLineJoin() { [native code] }
setLineWidth: function setLineWidth() { [native code] }
setMiterLimit: function setMiterLimit() { [native code] }
setShadow: function setShadow() { [native code] }
setStrokeColor: function setStrokeColor() { [native code] }
setTransform: function setTransform() { [native code] }
stroke: function stroke() { [native code] }
strokeRect: function strokeRect() { [native code] }
strokeText: function strokeText() { [native code] }
transform: function transform() { [native code] }
translate: function translate() { [native code] }
__proto__: Object
__defineGetter__: function __defineGetter__() { [native code] }
__defineSetter__: function __defineSetter__() { [native code] }
__lookupGetter__: function __lookupGetter__() { [native code] }
__lookupSetter__: function __lookupSetter__() { [native code] }
constructor: function Object() { [native code] }
hasOwnProperty: function hasOwnProperty() { [native code] }
isPrototypeOf: function isPrototypeOf() { [native code] }
propertyIsEnumerable: function propertyIsEnumerable() { [native code] }
toLocaleString: function toLocaleString() { [native code] }
toString: function toString() { [native code] }
valueOf: function valueOf() { [native code] }
get __proto__: function __proto__() { [native code] }
set __proto__: function __proto__() { [native code] }

Very strange. I have to try

Barry_Johnson — Tue, 10 Mar 2015 16:37:29 GMT

Very strange. I have to try this myself. What device are you emulating, just so I make sure I try the same thing?

Google Nexus 4 is the

Spiros_N_ — Tue, 10 Mar 2015 16:42:56 GMT

Google Nexus 4 is the emulation device.

Is there a possibility that I'm using a wrong cordova 3.x plugin ?
What it the required plugin for the canvas ?

We are both going to feel

Barry_Johnson — Tue, 10 Mar 2015 17:02:12 GMT

We are both going to feel pretty silly. :-)

The toDataURL function is attached to the canvas, not the context. I didn't even notice it myself until I looked at my code. Almost everything else with the canvas happens with the context.

OOOOps !

Spiros_N_ — Tue, 10 Mar 2015 17:21:39 GMT

OOOOps !

Yes Barrett this is it !
Thanks for your help!

You are very welcome!

Barry_Johnson — Tue, 10 Mar 2015 17:44:59 GMT

You are very welcome!

topic We are both going to feel in Software Archive

toDataURL

Canvas.toDataURL works fine

Barrett J.

Seems strange, as it

This is it the ctx

Very strange. I have to try

Google Nexus 4 is the

We are both going to feel

OOOOps !

You are very welcome!