javascript - Not working 'PImage' as Class Property in Processing.js -

what trying is, declare class has image it's property.then declaring object of class , call draw function.but it's not working....why? here processing.js part of .html page

 <script type="text/processing">            pimage starimage;            void setup(){              size(400,400);              smooth();                starimage = loadimage("star.png");              }            var star = function(x,y)          {              this.x = x;              this.y = y;              this.img  = starimage;          };            star.prototype.drawstar = function(){              image(this.img,this.x,this.y,50,50);          };            var obj = new star(50,50);            draw = function(){              obj.drawstar();          };        </script>

but if change "image(this.img,this.x,this.y,50,50);" "image(starimage,this.x,this.y,50,50);",it's works.that seems assignment of 'starimage' (pimage) in this.img not working.

i think main problem you're creating star object before load starimage pimage. try refactoring code make sure load image before create star object.

here how you'd in pure processing:

pimage starimage;  star obj;  void setup() {   size(400, 400);   smooth();    starimage = loadimage("star.png");   obj = new star(50, 50, starimage); }  class star{    float x;   float y;   pimage img;    public star(float x, float y, pimage img){     this.x = x;     this.y = y;     this.img = img;   }    public void drawstar(){     image(this.img, this.x, this.y, 50, 50);   } }  void draw(){   obj.drawstar(); } 

that should work in processing.js too. notice star object isn't being created until after image loaded.