TypeError: value.indexOf is not a function when using a gradient for strokeStyle about canvas2svg HOT 7 OPEN

Looks like width and height was not defined when you created a new C2S. If you open up dev tools on jsFiddle they'll show you the js errors. http://jsfiddle.net/5bbn59rs/5/

from canvas2svg.

any update for this issue?

from canvas2svg.

Am also getting this error with constructor call new Context({ document, width: 1920, height: 1080 })

from canvas2svg.

So, in my case the problem is with Line 383:

if ((style.svgAttr === "stroke" || style.svgAttr === "fill") && value.indexOf && value.indexOf("rgba") !== -1)

It appears that the logic doesn't expect to have to handle a CanvasGradient object as a value of fill, which is rather standard. This line should check that it's not dealing with a string first by testing for indexOf existence first.

from canvas2svg.

It's expecting a C2S CanvasGradient not a HTMLCanvasElement CanvasGradient. If you create your gradient using ctx.createLinearGradient or ctx.createRadialGradient method on the C2S instance you should not run into the issue.

from canvas2svg.

I ran into the same problem as @barberousse
Adding the following code to the already existing else-if clauses seems to fix this issue:

// other if statements...

// Add this before the last else-if clause
else if(style.apply.indexOf("stroke") !==-1 && value instanceof CanvasGradient) {
  this.__currentElement.setAttribute("stroke", format("url(#{id})", {id:value.__root.getAttribute("id")}));
}

// Last else-if clause
else if ((style.svgAttr === "stroke" || style.svgAttr === "fill") && value.indexOf("rgba") !== -1){
 // ...
}

Can someone confirm, that I'm on the right track?

from canvas2svg.

unrelated to original issue perhaps, but I ran into this same error message when I was passing an object to the fillStyle (object was a Color object from https://www.npmjs.com/package/color)

the HTML5 canvas API presumably stringifies this Color object automatically, but it caused a crash in canvas2svg (solution: just stringify manually before setting ctx.fillStyle)

from canvas2svg.