How JustAnswer Works:
  • Ask an Expert
    Experts are full of valuable knowledge and are ready to help with any question. Credentials confirmed by a Fortune 500 verification firm.
  • Get a Professional Answer
    Via email, text message, or notification as you wait on our site.
    Ask follow up questions if you need to.
  • 100% Satisfaction Guarantee
    Rate the answer you receive.
Ask Chris Baxter Your Own Question
Chris Baxter
Chris Baxter, Programming Tutor
Category: Programming
Satisfied Customers: 250
Experience:  Completed BSIT concentration Software Engineering, tutored other students and classmates in Java and VB.net, C++, and Obj C.
68869132
Type Your Programming Question Here...
Chris Baxter is online now
A new question is answered every 9 seconds

Issue in Angular J, JQuery Our issue is that we can not load

Customer Question

Issue in Angular J , JQuery
Our issue is that we can not load images inside the loop in jquery and angularJs. There is problem is that when we load first image, there is some time in between loading first image, in this time next function executed for second function gets called.
Our aim is that we have to wait for all execution of first image and then execution goes to second image and all other images same.
In case of multiple pages in PDF , if we have 10 pages in that PDF, while loading our PDF in canvas we have to convert it into image one by one page.
Now consider we have editing first page, We have to write first page image on Canvas and then we write content of that page on that canvas but here problem is that we load first page on canvas it takes some more time in between that time another function automatically gets called which need not to get called before completing above process.
if you want to check actual piece of code
for (var i = 0; i < 10; i++) {
var b_canvas1 = document.getElementById("printcanvas");
var canvasContext = b_canvas1.getContext("2d");
canvasContext.clearRect(0, 0, b_canvas1.width, b_canvas1.height);
var img = new Image();
img.onload = function () {
canvasContext.drawImage(img, 0, 0, img.width * 0.65, img.height * 0.65);
//here also we having lot of functionality and after that having 1500-2000 lines and then we made image from that canvas like following
var img1=new Image();
img1.onload=function(){
//here we made images from canvas
$("#print_images").append("");
}
img1.src=b_canvas1.toDataUrl();
}
img.src = imggg;
}
Submitted: 1 year ago.
Category: Programming
Expert:  Chris Baxter replied 1 year ago.

Hello!

This issue will require a fair bit of instruction, so I have included a link to the source material for your information. As to the code, it is very difficult to evaluate in the format provided, so I recommend using wikisend.com to send a link to the files or to otherwise upload the file set if you want a closer look at it. If you have a look at the following link, you will find that it describes how to handle loading events, and I hope you find it helpful! Thanks!

http://stackoverflow.com/questions/14968690/sending-event-when-angular-js-finished-loading

Customer: replied 1 year ago.
We tried the recommendations in the link but didn't work. Please see the attached file with the code.Basic flow is that we are converting pdf pages to images in our software, when user is editing those images we are capturing mouse events, signatures , lines etc drawn by user and storing all this in database. At time of downloading any edited pdf we need to convert this images once again into pdf and add changes done by user.The logic behind is that image will act like background and we will merge user changes on that image but in this processes system is taking time to load background image but till then system also start writing canvas content on image, as image is not loaded on background its look like blank background with user content only.Problem becomes more critical when pdf has multiple pages because here we can not use loop.See the attached file with the code. Our issues are mentioned in comments.Thanks
JG
Expert:  Chris Baxter replied 1 year ago.

Ah! That not working we will want to use "console.log()" if it is acceptable to have a wait for the pictures to load. Since it sounds like you know your code well, I have a link to that info for code example, etc. I know I know, a console wait and timeout is a dirty solution but it should work with little implementation and coding.

https://github.com/processing/p5.js/wiki/Loading-external-files:-AJAX,-XML,-JSON

Expert:  Chris Baxter replied 1 year ago.

Please don't forget to rate and accept! :)

Related Programming Questions