Вопрос

So I want define styling function( for my points) from geojson using fillcolor depend on one atribute - feature.properties.Nab( which means religion). I found only examples for polygons or polylines. I have no idea where is problem. TY for help and its my first question here, so dont kill me, if I ask something trivial :).

var geojsonMarkerOptions1 = {
    radius: 7,
    fillColor: getColor(feature.properties.Nab),
    color: "red",
    weight: 1,
    opacity: 1,
    fillOpacity: 0.8
};

function getColor (feature) {
         switch (feature.properties.Nab) {
         case 'Katolici' : return {fillcolor: "blue"};
         case 'Protestanti' : return {fillcolor: "red"};
}
};

L.geoJson(sidla, {
 pointToLayer: function (feature, latlng) {
  return L.circleMarker(latlng, geojsonMarkerOptions1);
 }
}).addTo(map);

//my data:

 var sidla ={
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },

"features": [
{ "type": "Feature", "properties": { "id": 3, "Nazov": "Lipt_Jan", "Nab": "Katolici", "Nar": "Slovaci" }, "geometry": { "type": "Point", "coordinates": [ 19.677321608721062, 49.049820448418181 ] } },
{ "type": "Feature", "properties": { "id": 2, "Nazov": "Lipt_PETER", "Nab": "Katolici", "Nar": "Nemci" }, "geometry": { "type": "Point", "coordinates": [ 19.733272790197596, 49.053442098858454 ] } },
{ "type": "Feature", "properties": { "id": 1, "Nazov": "Lipt_hradok", "Nab": "Protestanti", "Nar": "Slovaci" }, "geometry": { "type": "Point", "coordinates": [ 19.725950783732767, 49.037323729155595 ] } }
]
}

Это было полезно?

Решение

In the object geojsonMarkerOptions1 you don't have access to the feature. It is an object used exclusively to assign a default style for your markers. To assign a different style for each marker you should provide a function to the style parameter of L.geoJSON.

Something like this should work:

var geojsonMarkerOptions1 = {
    radius: 7,
    fillColor: "grey",
    color: "red",
    weight: 1,
    opacity: 1,
    fillOpacity: 0.8
};

function getColor (feature) {
         switch (feature.properties.Nab) {
         case 'Katolici' : return {fillColor: "blue"};
         case 'Protestanti' : return {fillColor: "red"};
}
};

L.geoJson(sidla, {
 pointToLayer: function (feature, latlng) {
  return L.circleMarker(latlng, geojsonMarkerOptions1);
 },
 style: getColor
}).addTo(map);
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top