added support for text labels. This also adds getCentroid methods to all

geometries. Thanks crschmidt for the great help with this patch, and thanks to camptocamp for the initial work on this and rcoup for creating the first patches. r=crschmidt (closes #1895) git-svn-id: http://svn.openlayers.org/trunk/openlayers@9262 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2009-04-10 16:05:26 +00:00
parent dd556be0be
commit cc2e19d789
15 changed files with 560 additions and 50 deletions
--- a/examples/vector-features-with-text.html
+++ b/examples/vector-features-with-text.html
@@ -0,0 +1,109 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <style type="text/css">
+        #map {
+            width: 800px;
+            height: 475px;
+            border: 1px solid black;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js" type="text/javascript"></script>
+    <script type="text/javascript">
+        var map;
+
+        function init(){
+            map = new OpenLayers.Map('map');
+            
+            var layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+            map.addLayer(layer);
+            
+            // allow testing of specific renderers via "?renderer=Canvas", etc
+            var renderer = OpenLayers.Util.getParameters(window.location.href).renderer;
+            renderer = (renderer) ? [renderer] : OpenLayers.Layer.Vector.prototype.renderers;
+            
+            var vectorLayer = new OpenLayers.Layer.Vector("Simple Geometry", {
+                styleMap: new OpenLayers.StyleMap({'default':{
+                    strokeColor: "#00FF00",
+                    strokeOpacity: 1,
+                    strokeWidth: 3,
+                    fillColor: "#FF5500",
+                    fillOpacity: 0.5,
+                    pointRadius: 6,
+                    pointerEvents: "visiblePainted",
+                    label : "name: ${name}, age: ${age}",
+                    
+                    fontColor: "${favColor}",
+                    fontSize: "12px",
+                    fontFamily: "Courier New, monospace",
+                    fontWeight: "bold",
+                    labelAlign: "${align}"
+                }}),
+                renderers: renderer
+            });
+            
+            // create a point feature
+            var point = new OpenLayers.Geometry.Point(-111.04, 45.68);
+            var pointFeature = new OpenLayers.Feature.Vector(point);
+            pointFeature.attributes = {
+                name: "toto",
+                age: 20,
+                favColor: 'red',
+                align: "cm"
+            };
+            
+            // create a polygon feature from a linear ring of points
+            var pointList = [];
+            for(var p=0; p<6; ++p) {
+                var a = p * (2 * Math.PI) / 7;
+                var r = Math.random(1) + 1;
+                var newPoint = new OpenLayers.Geometry.Point(point.x + 5 + (r * Math.cos(a)),
+                                                             point.y + 5 + (r * Math.sin(a)));
+                pointList.push(newPoint);
+            }
+            pointList.push(pointList[0]);
+            
+            var linearRing = new OpenLayers.Geometry.LinearRing(pointList);
+            var polygonFeature = new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Polygon([linearRing]));
+            polygonFeature.attributes = {
+                name: "dude",
+                age: 21,
+                favColor: 'purple',
+                align: 'lb'
+            };
+            
+            multiFeature = new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Collection([
+                    new OpenLayers.Geometry.LineString([
+                        new OpenLayers.Geometry.Point(-105,40),
+                        new OpenLayers.Geometry.Point(-95,45)
+                    ]),
+                    new OpenLayers.Geometry.Point(-105, 40)
+                ]),
+                {
+                    name: "ball-and-chain",
+                    age: 30,
+                    favColor: 'black',
+                    align: 'rt'
+                });
+            var nullFeature = new OpenLayers.Feature.Vector(null);
+            nullFeature.attributes = {
+                name: "toto is some text about the world",
+                age: 20,
+                favColor: 'red',
+                align: "cm"
+            };
+            
+            map.addLayer(vectorLayer);
+            vectorLayer.drawFeature(multiFeature);
+            map.setCenter(new OpenLayers.LonLat(point.x, point.y), 5);
+            vectorLayer.addFeatures([pointFeature, polygonFeature, multiFeature, nullFeature ]);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <div id="map"></div>
+    <p>This example shows drawing simple vector features with a label</p>
+  </body>
+</html>