diff --git a/lib/OpenLayers/Renderer/SVG.js b/lib/OpenLayers/Renderer/SVG.js index 32ca4feafb..6395050d26 100644 --- a/lib/OpenLayers/Renderer/SVG.js +++ b/lib/OpenLayers/Renderer/SVG.js @@ -52,6 +52,14 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { */ isGecko: null, + /** + * Property: supportUse + * {Boolean} true if defs/use is supported - known to not work as expected + * at least in some applewebkit/5* builds. + * See https://bugs.webkit.org/show_bug.cgi?id=33322 + */ + supportUse: null, + /** * Constructor: OpenLayers.Renderer.SVG * @@ -65,6 +73,7 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { OpenLayers.Renderer.Elements.prototype.initialize.apply(this, arguments); this.translationParameters = {x: 0, y: 0}; + this.supportUse = (navigator.userAgent.toLowerCase().indexOf("applewebkit/5") == -1); this.isGecko = (navigator.userAgent.toLowerCase().indexOf("gecko/") != -1); }, @@ -208,7 +217,7 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { if (style.externalGraphic) { nodeType = "image"; } else if (this.isComplexSymbol(style.graphicName)) { - nodeType = "use"; + nodeType = this.supportUse === false ? "svg" : "use"; } else { nodeType = "circle"; } @@ -288,7 +297,6 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { var offset = style.pointRadius * 3; var size = offset * 2; var id = this.importSymbol(style.graphicName); - var href = "#" + id; pos = this.getPosition(node); widthFactor = this.symbolSize[id] / size; @@ -300,7 +308,17 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { parent.removeChild(node); } - node.setAttributeNS(this.xlinkns, "href", href); + if(this.supportUse === false) { + // workaround for webkit versions that cannot do defs/use + // (see https://bugs.webkit.org/show_bug.cgi?id=33322): + // copy the symbol instead of referencing it + var src = document.getElementById(id); + node.firstChild && node.removeChild(node.firstChild); + node.appendChild(src.firstChild.cloneNode(true)); + node.setAttributeNS(null, "viewBox", src.getAttributeNS(null, "viewBox")); + } else { + node.setAttributeNS(this.xlinkns, "href", "#" + id); + } node.setAttributeNS(null, "width", size); node.setAttributeNS(null, "height", size); node.setAttributeNS(null, "x", pos.x - offset); @@ -906,6 +924,26 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { this.defs.appendChild(symbolNode); return symbolNode.id; }, + + /** + * Method: getFeatureIdFromEvent + * + * Parameters: + * evt - {Object} An object + * + * Returns: + * {} A geometry from an event that + * happened on a layer. + */ + getFeatureIdFromEvent: function(evt) { + var featureId = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent.apply(this, arguments); + if(this.supportUse === false && !featureId) { + var target = evt.target; + featureId = target.parentNode && target != this.rendererRoot && + target.parentNode._featureId; + } + return featureId; + }, CLASS_NAME: "OpenLayers.Renderer.SVG" });