Use the graphicOpacity to set canvas.globalAlpha. Move the image source assignment after the onload. r=crschmidt (closes #2608)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@10673 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

lib/OpenLayers/Renderer/Canvas.js

@@ -166,7 +166,6 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
      */ 
     drawExternalGraphic: function(pt, style) {
        var img = new Image();
-       img.src = style.externalGraphic;
        
        if(style.graphicTitle) {
            img.title=style.graphicTitle;           
@@ -180,19 +179,21 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
            style.graphicXOffset : -(0.5 * width);
        var yOffset = (style.graphicYOffset != undefined) ?
            style.graphicYOffset : -(0.5 * height);
-       var opacity = style.graphicOpacity || style.fillOpacity;
        
        var context = { img: img, 
                        x: (pt[0]+xOffset), 
                        y: (pt[1]+yOffset), 
                        width: width, 
                        height: height, 
+                       opacity: style.graphicOpacity || style.fillOpacity,
                        canvas: this.canvas };
 
        img.onload = OpenLayers.Function.bind( function() {
+           this.canvas.globalAlpha = this.opacity;
            this.canvas.drawImage(this.img, this.x, 
                                  this.y, this.width, this.height);
-       }, context);   
+       }, context);
+       img.src = style.externalGraphic;
     },
 
     /**