Search code examples
javascriptjsonhtmlcanvasfabricjs

Curved text created by fabric.curvedText.js not supporting loadFromJSON function


When I add curved text on canvas and convert canvas to JSON by using JSON.stringify(canvas); function, I am getting JSON like :

var front='{"objects":[{"type":"curvedText","originX":"center","originY":"center","left":180,"top":110,"width":149,"height":100.26,"fill":"rgb(0,0,0)","overlayFill":null,"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,"selectable":true,"hasControls":true,"hasBorders":true,"hasRotatingPoint":true,"transparentCorners":true,"perPixelTargetFind":false,"shadow":null,"visible":true,"clipTo":null,"text":"trstererer","fontSize":30,"fontWeight":"bold","fontFamily":"conv_bpreplayextended","fontStyle":"","lineHeight":1.3,"textDecoration":"","textShadow":"","textAlign":"center","path":null,"backgroundColor":"","textBackgroundColor":"","useNative":true,"radius":50,"spacing":15,"reverse":false,"bulge":true,"curve":false,"pintch":false,"arch":false,"wedge":false,"roof":false,"bridge":false,"vally":false}],"background":""}'

but error occurs when I want to load above json again On the canvas using canvas.loadFromJSON(front);:

Uncaught TypeError: Cannot read property 'async' of undefined fabric.all.min.js:863 (anonymous function) fabric.all.min.js:863 v fabric.all.min.js:860 fabric.util.object.extend._enlivenObjects fabric.all.min.js:3719 fabric.util.object.extend.loadFromJSON fabric.all.min.js:3700 (anonymous function)


Solution

  • Finally I got solution to this problem.

    I have added code from fabric.curvedText.js to the fabric.all.min

    then issue of e.type undefined is solved.

    then I have searched a lot on the getKlass and finally got solution :

    https://groups.google.com/forum/#!topic/fabricjs/oLDIW_MoRRY here

    I have given type=curvedText and class name as fabric.CurvedText which mismatches

    now I have changed it to the fabric.Curvedtext and what a surprise It works ...

    Thank you Kangax n Yesh too.