arreglo dinamico de mapas solo me muestra el ultimo valor

[pcarvajal]

Hola,
Estoy mostrando en un mapa de leaflet de la siguiente forma:

Código Javascript:

<script>        
        //begin no modificar -->
        var osmLink = '<a href="http://openstreetmap.org">OpenStreetMap</a>',
            thunLink = '<a href="http://thunderforest.com/">Thunderforest</a>';
        
        var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            osmAttrib = '&copy; ' + osmLink + ' Contributors',
            landUrl = 'http://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png',
            thunAttrib = '&copy; '+osmLink+' Contributors & '+thunLink;
 
        var osmMap = L.tileLayer(osmUrl, {attribution: osmAttrib}),
            landMap = L.tileLayer(landUrl, {attribution: thunAttrib});
 
        var map = L.map('map', {
                layers: [osmMap] // only add one! este es mapa base
            })
            .setView([-33.4387,-70.647], 18); //Chile
        //<-- end no modificar
 
 
 
        var baseLayers = {
            "OSM Mapnik": osmMap,
            "Landscape": landMap
        };      
        
/////////////////////////////////////////////////////////////////////////////////////////////
var overlays = {
            'Precipitaciones': L.tileLayer.provider('OpenWeatherMap.PrecipitationClassic'),
            'Lluvia': L.tileLayer.provider('OpenWeatherMap.RainClassic'),
            'Presión': L.tileLayer.provider('OpenWeatherMap.Pressure'),
            'Control de Presion': L.tileLayer.provider('OpenWeatherMap.PressureContour'),
            'Viento': L.tileLayer.provider('OpenWeatherMap.Wind'),
            'Temperatura': L.tileLayer.provider('OpenWeatherMap.Temperature')
        };
/////////////////////////////////////////////////////////////////////////////////////////////
 
    
        L.control.layers(baseLayers,overlays).addTo(map);
 
    </script>
</body>
</html>
 

pero necesito modificar el codigo del overlay y armarlo dinamicamente, entonces tenemos:

Código Javascript:

<script>        
        //begin no modificar -->
        var osmLink = '<a href="http://openstreetmap.org">OpenStreetMap</a>',
            thunLink = '<a href="http://thunderforest.com/">Thunderforest</a>';
        
        var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            osmAttrib = '&copy; ' + osmLink + ' Contributors',
            landUrl = 'http://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png',
            thunAttrib = '&copy; '+osmLink+' Contributors & '+thunLink;
 
        var osmMap = L.tileLayer(osmUrl, {attribution: osmAttrib}),
            landMap = L.tileLayer(landUrl, {attribution: thunAttrib});
 
        var map = L.map('map', {
                layers: [osmMap] // only add one! este es mapa base
            })
            .setView([-33.4387,-70.647], 18); //Chile
        //<-- end no modificar
 
 
        var baseLayers = {
            "OSM Mapnik": osmMap,
            "Landscape": landMap
        };      
 
/////////////////////////////////////////////////////////////////////////////////////////////
var overlays = {};
        var item1 = "Lluvia";
        var valor1 = "L.tileLayer.provider('OpenWeatherMap.PrecipitationClassic')";
        var item2 = "Temperatura";
        var valor2 = "L.tileLayer.provider('OpenWeatherMap.Temperature')";      
 
        overlays[item1] = valor1;
        overlays[item2] = valor2;[/B][/COLOR]
/////////////////////////////////////////////////////////////////////////////////////////////
        
        L.control.layers(baseLayers,overlays).addTo(map);
 
    </script>
 

el problema es que el menu solo me muestra el ultimo item que he agregado y no se como hacerlo para que me los muestre todos