title: Add static labels to circle markers in leaflet
body: <p>I am trying to add additional labels to my circle markers in Leaflet.</p>
  
  <p>So right now I have like this:
  <a href="https://i.stack.imgur.com/shITM.png" rel="noreferrer"><img src="https://i.stack.imgur.com/shITM.png" alt="Circles on a map without labels"></a></p>
  
  <p>But I need to have this kind of look:
  <a href="https://i.stack.imgur.com/LyzFZ.png" rel="noreferrer"><img src="https://i.stack.imgur.com/LyzFZ.png" alt="Circles on a map with labels"></a></p>
  
  <p>Here is my code part:</p>
  
  <pre><code>var Classroomsbyamount = new L.LayerGroup();
  var Classroomsamount = new L.geoJson(buildingPoints, { 
      pointToLayer: function(feature, latlng) {
          if(feature.properties.Classroomsstyleamt) {
          return new L.CircleMarker(latlng, feature.properties.Classroomsstyleamt, {radius: feature.radius}); }
      }, 
      onEachFeature: function(feature, layer) { 
          if (feature.properties &amp;&amp; feature.properties.building_name) { 
              var thenumber20 = feature.properties.spacecategoryClassroomsamt; 
              var number30 = thenumber20.toLocaleString('en');
              layer.bindPopup({ html: '&lt;b&gt;' + number30 + '&lt;/b&gt;' });
              layer.bindPopup(feature.properties.building_name + "&lt;br&gt; Amount:" + number30, {maxWidth: "none", closeButton: true, offset: L.point(0, -20)});
              layer.on('mouseover', function() { layer.openPopup(); }); 
              layer.on('click', function() { 
                  var capacityGroup = feature.properties.building_name;
                  popUp(capacityGroup);
              });
          }
      }
  
  
  
  }).addTo(Classroomsbyamount);
  </code></pre>
  
  <p>How can I add labels to my circles on the map?</p>