diff --git a/examples/graphic-name.html b/examples/graphic-name.html index 71a9bb0106..93313a9eea 100644 --- a/examples/graphic-name.html +++ b/examples/graphic-name.html @@ -1,91 +1,39 @@ - - - OpenLayers Graphic Names - - - - - - -

Named Graphics Example

- -
- vector, named graphic, star, cross, x, square, triangle, circle, style -
- -

- Shows how to use well-known graphic names. -

- -
- -
- OpenLayers supports well-known names for a few graphics. You can use - the names "star", "cross", "x", "square", "triangle", and "circle" as - the value for the graphicName property of a symbolizer. -
- - \ No newline at end of file + + + + + OpenLayers Graphic Names + + + + + + +

Named Graphics Example

+
+ vector, named graphic, star, cross, x, square, triangle, circle, style +
+

+ Shows how to use well-known graphic names. +

+
+
+
+

+ OpenLayers supports well-known names for a few graphics. You + can use the names "star", "cross", + "x", "square", "triangle", and + "circle" as value for the graphicName property of a + symbolizer. +

+

+ The named symbols "lightning", "rectangle" + and "church" are user defined. +

+

+ See graphic-name.js + for the source code of this example. +

+
+ + diff --git a/lib/OpenLayers/Renderer/SVG.js b/lib/OpenLayers/Renderer/SVG.js index 69c11d3535..38c32254a4 100644 --- a/lib/OpenLayers/Renderer/SVG.js +++ b/lib/OpenLayers/Renderer/SVG.js @@ -49,14 +49,6 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { */ symbolMetrics: 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 * @@ -70,7 +62,6 @@ 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.symbolMetrics = {}; }, @@ -215,7 +206,7 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { if (style.externalGraphic) { nodeType = "image"; } else if (this.isComplexSymbol(style.graphicName)) { - nodeType = this.supportUse === false ? "svg" : "use"; + nodeType = "svg"; } else { nodeType = "circle"; } @@ -306,17 +297,17 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { parent.removeChild(node); } - 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); - } + // The more appropriate way to implement this would be use/defs, + // but due to various issues in several browsers, it is safer to + // copy the symbols instead of referencing them. + // See e.g. ticket http://trac.osgeo.org/openlayers/ticket/2985 + // and this email thread + // http://osgeo-org.1803224.n2.nabble.com/Select-Control-Ctrl-click-on-Feature-with-a-graphicName-opens-new-browser-window-tc5846039.html + 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")); + node.setAttributeNS(null, "width", size); node.setAttributeNS(null, "height", size); node.setAttributeNS(null, "x", pos.x - offset); @@ -334,19 +325,15 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { } var rotation = style.rotation; + if ((rotation !== undefined || node._rotation !== undefined) && pos) { node._rotation = rotation; rotation |= 0; - if(node.nodeName !== "svg") { - node.setAttributeNS(null, "transform", - "rotate(" + rotation + " " + pos.x + " " + - pos.y + ")"); - } else { - var metrics = this.symbolMetrics[id]; - node.firstChild.setAttributeNS(null, "transform", - "rotate(" + style.rotation + " " + metrics[1] + - " " + metrics[2] + ")"); - } + var metrics = this.symbolMetrics[id]; + node.firstChild.setAttributeNS(null, "transform", "rotate(" + + rotation + " " + + metrics[1] + " " + + metrics[2] + ")"); } } @@ -951,7 +938,7 @@ OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, { */ getFeatureIdFromEvent: function(evt) { var featureId = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent.apply(this, arguments); - if(this.supportUse === false && !featureId) { + if(!featureId) { var target = evt.target; featureId = target.parentNode && target != this.rendererRoot && target.parentNode._featureId; diff --git a/tests/Renderer/SVG.html b/tests/Renderer/SVG.html index 141a3ffb3d..5faeda49bf 100644 --- a/tests/Renderer/SVG.html +++ b/tests/Renderer/SVG.html @@ -378,22 +378,6 @@ var string = r.getShortString(point); t.eq(string, "2,-4", "returned string is correct"); } - - function test_svg_getnodetype(t) { - if (!OpenLayers.Renderer.SVG.prototype.supported()) { - t.plan(0); - return; - } - - t.plan(1); - - var r = new OpenLayers.Renderer.SVG(document.body); - - var g = {CLASS_NAME: "OpenLayers.Geometry.Point"} - var s = {graphicName: "square"}; - - t.eq(r.getNodeType(g, s), r.supportUse ? "use" : "svg", "Correct node type for well known symbols"); - } function test_svg_importsymbol(t) { if (!OpenLayers.Renderer.SVG.prototype.supported()) {