javascript - Fabricjs canvas objects iterarion -

i got problems code below :

var canvas = new fabric.canvas('c'); canvas.selection = false; fabric.loadsvgfromurl('./svg/1.svg',     function (objects) {         canvas.add.apply(canvas, objects);         canvas.renderall();     }); -- part working obj = canvas.getobjects(); obj.foreach(function (item, i) {     console.log('plz work');     item.setcolor('red');     item.set('selectable', false);     canvas.renderall(); }); - isn't working  

when write code in js file it's not working, when run in browser console works perfectly. what's wrong it?

this because, obj array has no objects in (meaning it­'s empty), when iterating on it, there isn't other objects on canvas, , since loadsvgfromurl method asynchronous, can't hold of svg objects until it­'s loaded , added canvas.

to resolve this, iteration inside callback function of loadsvgfromurl.

here working code :

var canvas = new fabric.canvas('c');  canvas.selection = false;  fabric.loadsvgfromurl('https://istack.000webhostapp.com/1tf.svg', function(objects) {     canvas.add.apply(canvas, objects);     canvas.renderall();       //do iteration here     obj = canvas.getobjects();     obj.foreach(function(item, i) {        console.log('plz work');        item.setcolor('red');        item.set('selectable', false);        canvas.renderall();     });  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.16/fabric.min.js"></script>  <canvas id="c" width="200" height="200"></canvas>