CartodbJS sandwich example 2

Set several HTTP layers with a CartoB Mapnik in the middle

HTML

<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css">
<script src="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/cartodb.js"></script>
<div id="map"></div>

CSS

html, body, #map {
    width:100%;
    height:100%;
    padding: 0;
    margin: 0;
}

JavaScript

//Create the leaflet map
var map = L.map('map', {
    zoomControl: true,
    center: [39,-4],
    zoom: 5,
    minZoom: 3, 
    maxZoom: 13
});

cartodb.createLayer(map, {
    user_name: 'examples',
    type: 'cartodb',
    sublayers: [{
        type: "http",
        urlTemplate: "http://{s}.basemaps.cartocdn.com/light/{z}/{x}/{y}.png",
        subdomains: ["a", "b", "c"]
    }, {
        type: 'mapnik',
        sql: 'select * from country_boundaries where cartodb_id = 50',
        cartocss: '#layer { polygon-fill: lighten(red,30); polygon-opacity: 0.3; line-color: #F00; }'
    }, {
        type: "http",
        urlTemplate: "https://cartodb-wms.global.ssl.fastly.net/mapproxy/wms_magrama_es_Riesgo_en_puntos_de_especial_importancia_EPSG_3857/wmts/map/webmercator/{z}/{x}/{y}.png"
    }, {
        type: "http",
        urlTemplate: "http://{s}.basemaps.cartocdn.com/light_only_labels/{z}/{x}/{y}.png",
        subdomains: ["a", "b", "c"]
    }]
}).addTo(map);