Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I'm using Leaflet combined with GeoJSON features. Is there a way to label GeoJSON features (in this case - polygons)? It should get labels from

feature.properties.name 

This is my code where I think I could insert label:

function style(feature) {
            return {
                weight: 2,
                opacity: 1,
                color: 'white',
                dashArray: '3',
                fillOpacity: 0.7,
                fillColor: getColor(feature.properties.coloring)
            };
        }
share|improve this question

2 Answers 2

up vote 3 down vote accepted

You need to know the format leaflet expects to use. RFM. Example: OpenLayers expects this GeoJSON format to create a point and give some custom attributes:

{"type":"FeatureCollection",
    "features":[
        {"type":"Feature",
            "properties":{
                "name":"TRON-02",
                "serial":"TRON002",
                "bearing":0,
                "color":"green",
                "size":15,
                "image":"img/unit_map3.png",
            },
            "geometry":{
                "type":"Point",
                "coordinates":[-50.06542968749966,-23.749149728383717]
            }
        }
    ]
}

As you can see, I've created a Geometry (Point) and join my attributes to it. When I send this to OpenLayers, the result will fit in @Aragon's example, using "color" and "name" (as label) to customize the point in map.

Please copy and paste this GeoJSON example in http://json.parser.online.fr/ or use the site to try and validate your own.

share|improve this answer

i think this question is about openlayers.if so, you can use for labelling;

var style = new OpenLayers.Style({
    weight: 2,
    opacity: 1,
    color: 'white',
    dashArray: '3',
    fillOpacity: 0.7,
    fillColor: "${getColor}",  
    label: "${getLabel}"
  } , {
    context: {
      getColor: function(feature) {
        return feature.properties.color;
      },
      getLabel: function(feature) {
        return feature.properties.name;
      }
    }
  );

i hope it helps you...

share|improve this answer
    
It isn't OpenLayers. I'm using Leaflet combined with GeoJSON features. So this doesn't work. But thank you for trying. –  againstflow Dec 4 '12 at 13:42
    
Why you do not fillColor: "${color}" instead of creating a function? –  Magno C Dec 4 '12 at 14:29
1  
@Magno C there is no difference between your point.both of them are the same. i have written this for if you want to add more complicated function as random color or anything else. still thank you for your point. –  Aragon Dec 4 '12 at 14:38
    
Understood Aragon. Thanks for the new method. May be useful in future. Thumbs UP ! –  Magno C Dec 4 '12 at 14:45
    
I think there is no way @againstflow run out from the format I've show, since there is a specification ruling GeoJSON here : link –  Magno C Dec 4 '12 at 15:03

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.