image.onLoad -- how should I keep data available until this triggers?
<pre><code>//Draw Icon
for (var i = 0; i &lt; diagram.Children.length; i++) {
    if (diagram.Children[i].Icon != -1) {
        var myImage = new Image();

        myImage.xOffset = diagram.Children[i].Offset.X;
        myImage.yOffset = diagram.Children[i].Offset.Y;
        myImage.componentName = diagram.Children[i].Name;
        myImage.componentLevel = diagram.Level;
        myImage.componentID = diagram.ID;
        myImage.type = diagram.Type;

        myImage.onload = function () {
            var self = this;
            var iconImage = new Kinetic.Image({
                image: self,
                x: self.xOffset,
                y: self.yOffset,
                tooltip: CreateTooltip(self.componentName, self.componentID, self.type),
                componentLevel: self.componentLevel,
                componentID: self.componentID
            });

            _stage.diagramLayer.add(iconImage);
            _stage.diagramLayer.draw();
        }

        //TODO: IE8+ doesn't support data URI's unless they are defined in css. 
        //myImage.src = 'data:image/png;base64,' + diagram.Children[i].Icon;
        myImage.src = '../PlanView/RenderIcon?IconID=' + diagram.Children[i].Icon;
    }
}
</code></pre>

<p>It seems counter-intuitive to have to store my data as properties of image before loading the image only to be able to access those properties during the 'onload' event. I was unsuccessful at finding an alternative, though. I was wondering if anyone had any ideas. Thanks.</p>
