javascript - Saving JSON in canvas with fabric.js - Stack Overflow

admin管理员组

文章数量:1022834

I am trying to import multiple svg file and after modification saving the json to database. I have tried to use

    canvas.item(0).sourcePath = '/URL/FILE.svg';
    JSON.stringify(canvas.toDatalessJSON());

but this won't work for multiple files, it works for the first file only. i am trying to specify every single file url but can't understand how this can be done. any solution please?

thanks in advance

I am trying to import multiple svg file and after modification saving the json to database. I have tried to use

    canvas.item(0).sourcePath = '/URL/FILE.svg';
    JSON.stringify(canvas.toDatalessJSON());

but this won't work for multiple files, it works for the first file only. i am trying to specify every single file url but can't understand how this can be done. any solution please?

thanks in advance

• javascript
• json
• html
• canvas
• fabricjs

Share Improve this question Follow edited Apr 2, 2013 at 11:41 rafi asked Apr 2, 2013 at 11:34 rafirafi 1,55333 gold badges3131 silver badges4444 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

canvas.item(0) - gets the first object. canvas.item(1) - gets the second object and so on....

If you don't know the total amount of objects you can use the canvas.forEachObject option.

     canvas.forEachObject(function(obj){
        obj.sourcePath = '/URL/FILE.svg';
        console.log(obj.sourcePath)
     });

     JSON.stringify(canvas.toDatalessJSON());

You could also set obj.sourcePath when you load the svg like this.

    fabric.loadSVGFromString(svg, function(objects, options) {
      var obj = fabric.util.groupSVGElements(objects, options);
      obj.sourcePath = '/URL/FILE.svg';
      canvas.add(obj);
      canvas.renderAll();
    });

Hope that helps!

I am trying to import multiple svg file and after modification saving the json to database. I have tried to use

    canvas.item(0).sourcePath = '/URL/FILE.svg';
    JSON.stringify(canvas.toDatalessJSON());

but this won't work for multiple files, it works for the first file only. i am trying to specify every single file url but can't understand how this can be done. any solution please?

thanks in advance

I am trying to import multiple svg file and after modification saving the json to database. I have tried to use

    canvas.item(0).sourcePath = '/URL/FILE.svg';
    JSON.stringify(canvas.toDatalessJSON());

but this won't work for multiple files, it works for the first file only. i am trying to specify every single file url but can't understand how this can be done. any solution please?

thanks in advance

• javascript
• json
• html
• canvas
• fabricjs

Share Improve this question Follow edited Apr 2, 2013 at 11:41 rafi asked Apr 2, 2013 at 11:34 rafirafi 1,55333 gold badges3131 silver badges4444 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

canvas.item(0) - gets the first object. canvas.item(1) - gets the second object and so on....

If you don't know the total amount of objects you can use the canvas.forEachObject option.

     canvas.forEachObject(function(obj){
        obj.sourcePath = '/URL/FILE.svg';
        console.log(obj.sourcePath)
     });

     JSON.stringify(canvas.toDatalessJSON());

You could also set obj.sourcePath when you load the svg like this.

    fabric.loadSVGFromString(svg, function(objects, options) {
      var obj = fabric.util.groupSVGElements(objects, options);
      obj.sourcePath = '/URL/FILE.svg';
      canvas.add(obj);
      canvas.renderAll();
    });

Hope that helps!

本文标签： javascriptSaving JSON in canvas with fabricjsStack Overflow