Index: examples/modify-feature-with-labels.html =================================================================== --- examples/modify-feature-with-labels.html (revision 0) +++ examples/modify-feature-with-labels.html (revision 0) @@ -0,0 +1,276 @@ + + + + + + Modify Feature + + + + + + + + +

OpenLayers Modify Feature Example

+
A demonstration of the ModifyFeature control for editing vector features.
+
+
+ Label + + + + + + + + + + +
+
font size: +
labelXOffset: + horizontal align: +
labelYOffset: + vertical align: +
+
+
+ +
+ + Index: lib/OpenLayers/Renderer.js =================================================================== --- lib/OpenLayers/Renderer.js (revision 10081) +++ lib/OpenLayers/Renderer.js (working copy) @@ -185,7 +185,7 @@ var res = this.getResolution(); location.move(xOffset*res, yOffset*res); } - this.drawText(feature.id, style, location); + this.drawText(feature.id, style, location, feature.geometry); } else { this.removeText(feature.id); } Index: lib/OpenLayers/Renderer/SVG.js =================================================================== --- lib/OpenLayers/Renderer/SVG.js (revision 10081) +++ lib/OpenLayers/Renderer/SVG.js (working copy) @@ -687,12 +687,17 @@ * style - * location - {} */ - drawText: function(featureId, style, location) { + drawText: function(featureId, style, location, geometry) { var resolution = this.getResolution(); + + if (style.labelMode === 'path') { + var x = isNaN(style.labelXOffset) ? 0 : style.labelXOffset; + var y = isNaN(style.labelYOffset) ? 0 : style.labelYOffset; + } else { + var x = (location.x / resolution + this.left); + var y = (location.y / resolution - this.top); + } - var x = (location.x / resolution + this.left); - var y = (location.y / resolution - this.top); - var label = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX, "text"); var tspan = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX + "_tspan", "tspan"); @@ -734,15 +739,88 @@ tspan.setAttributeNS(null, "baseline-shift", OpenLayers.Renderer.SVG.LABEL_VSHIFT[align[1]] || "-35%"); } + + if (style.labelMode === 'path') { + var pathNodeId = featureId + this.LABEL_ID_SUFFIX + "_path"; + var textPathNodeId = featureId + this.LABEL_ID_SUFFIX + "_textpath"; - tspan.textContent = style.label; + var pathNode = this.nodeFactory(pathNodeId, "path"); + var textPathNode = this.nodeFactory(textPathNodeId, "textPath"); + + drawn = this.drawTextPath(pathNode, geometry); + if (drawn) { + pathNode.setAttributeNS(null, "fill", "none"); + + textPathNode.setAttributeNS(this.xlinkns, "xlink:href", "#"+pathNodeId); + textPathNode.setAttributeNS(null, "startOffset", + OpenLayers.Renderer.SVG.LABEL_ALIGN_START_OFFSET[align[0]] || "middle"); + + textPathNode.textContent = style.label; + + if(!pathNode.parentNode) { + this.textRoot.appendChild(pathNode); + } + if (!textPathNode.parentNode) + label.appendChild(textPathNode); + } + } else { + + tspan.textContent = style.label; + + if(!tspan.parentNode) { + label.appendChild(tspan); + } + } if(!label.parentNode) { - label.appendChild(tspan); this.textRoot.appendChild(label); } }, + /** + * Method: drawTextPath + * This method is only called by the renderer itself. + * + * Parameters: + * node - {DOMElement} + * geometry - {} + * + * Returns: + * {DOMElement} or null if the renderer could not draw all components + * of the polygon, or false if nothing could be drawn + */ + drawTextPath: function(node, geometry) { + var componentsResult; + var components; + + switch (geometry.CLASS_NAME) { + case "OpenLayers.Geometry.Polygon": + return this.drawPolygon(node, geometry); + case "OpenLayers.Geometry.Surface": + return this.drawSurface(node, geometry); + case "OpenLayers.Geometry.LinearRing": + case "OpenLayers.Geometry.LineString": + components = [geometry.components]; + break; + case "OpenLayers.Geometry.Point": + case "OpenLayers.Geometry.Rectangle": + default: + components = false; + } + + if (!components) + return false; + + componentsResult = this.getComponentsString( + geometry.components, " "); + if (componentsResult.path) { + node.setAttributeNS(null, "d", "M"+componentsResult.path); + return (componentsResult.complete ? node : null); + } else { + return false; + } + }, + /** * Method: getComponentString * @@ -970,6 +1048,16 @@ }; /** + * Constant: OpenLayers.Renderer.SVG.LABEL_ALIGN + * {Object} + */ +OpenLayers.Renderer.SVG.LABEL_ALIGN_START_OFFSET = { + "l": "0%", + "c": "50%", + "r": "100%" +}; + +/** * Constant: OpenLayers.Renderer.SVG.LABEL_VSHIFT * {Object} */