Leaflet styling geoJSON object radius by its feature property

Question

I am trying to style geoJSON objects by its feature properties (Capacity). I tried 2 ways:

1:

function getWidth(Capacity) {
return Capacity >= 40 ? 12 :
       Capacity >= 30 ? 8 :
       Capacity >= 20 ? 6 :
       Capacity >= 10 ? 3 :
       0;
       }

function getSize(h) {
return h >= 40 ? 12 :
       h >= 30 ? 8 :
       h >= 20 ? 6 :
       h >= 10 ? 3 :
       0;
       }

  function mystyle(feature) {
  if (currentZoom <= 12) {
    return {
      weight: 1, 
      opacity: 0.5,
    };
  }
  else {
    return {
      weight: getWidth(feature.properties.Capacity),
      radius: getSize(feature.properties.Capacity)
    };
  }
}

var johnlewis = L.geoJSON(jl, {
 style: mystyle,
 pointToLayer: function (feature, latlng) {
    return L.circleMarker(latlng);
},
  }).addTo(map);

and as a result I got something like this:

where only weight changed, although the zoom level 12 set in function (map.getZoom() doesn't work at all.

In my 2nd example:

  function style2(feature) {
return {
    fillColor: setColor(feature.properties.Type),
    fillOpacity: 0.5,
    weight: 2,
    opacity: 1,
    color: '#ffffff',
    dashArray: '3'
};
}   

var johnlewis = L.geoJSON(jl, {
style: function(feature) {
                    if (feature.properties.Capacity >= 5) {
                        return {
                            weight: 1,
                            radius: 4
                        };
                    }
                    if (feature.properties.Capacity >= 10) {
                        return {
                            weight: 2,
                            radius: 6
                        };
                    }
                    if (feature.properties.Capacity >= 20) {
                        return {
                            weight: 3,
                            radius: 8
                        };
                    }
                    else style2
                },

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

It looks slightly better, because the records has been distinguished both by weight and radius, however there is no default situation shown, that was descriubed in the else value. Although only 1st if responded. Another ones didn't contribute into this view, hence I have only 2 types of radius instead of 4.

Does anyone know how to solve this issue?

I want to have a full styled geoJSON by properties, but now I am suffering for a lack of default style.

I saw a few similar examples, but basically they doesn't match my situation.

EDIT:

Recently I tried stuff like this:

 function mystyle(feature) {
 var rad;
 if (feature.properties.Capacity = 3) {
   rad = 4;
    } else if (feature.properties.Capacity = 5) {
    rad = 6;
    }
    else if (feature.properties.Capacity = 18) {
    rad = 8;
    } else {
    rad = 1;
    }
    return {
    fillColor: '#ff4d4d',
    fillOpacity: 0.5,
    weight: 0,
    opacity: 1,
    radius: rad,
    color: '#ffffff',
    dashArray: '3'
   };
}   

 var johnlewis = L.geoJSON(jl, {
 style:mystyle,
    pointToLayer: function (feature, latlng) {
    return L.circleMarker(latlng);
    },
   }).addTo(map);

but instead of the radius I have got changes with the border weight (weight). See the result on the map below:

So it looks like the radius changes aren't supported in Leaflet are they?

Answer 1

Using L.Circle instead of circleMarker allows you to set the radius as part of the pointToLayer fuction.