[Ej] Apartamentos TUR

by Francisco

HTML

<link rel="stylesheet" href="https://mapea4-sigc.juntadeandalucia.es/assets/css/mapea-5.0.0.ol.min.css">
<script src="https://mapea4-sigc.juntadeandalucia.es/js/mapea-5.0.0.ol.min.js"></script>
<script src="http://mapea4-sigc.juntadeandalucia.es/js/configuration-5.0.0.js"></script>
<div id="mapjs" class="container"></div>

CSS

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: auto;
}

JavaScript

var myMap = M.map({
        container: 'mapjs',
		wmc: ['mapa'],
        controls: ['layerswitcher']
    });
    
    //APARTAMENTOS TURISTICOS
	
    let apartamentosEstrella1 = new M.style.Point({
        icon: {
            src: 'Apat_tur_1_marron.png'
        }
    });


    let apartamentosLlaves2 = new M.style.Point({
        icon: {
            src: 'Apat_tur_2_verde.png'
        }
    });

    let apartamentosLlaves3 = new M.style.Point({
        icon: {
            src: 'Apat_tur_3_celes.png'
        }
    });

    let apartamentosLlaves4 = new M.style.Point({
        icon: {
            src: 'Apat_tur_4_amarillo.png'
        }
    });

	
    let categoryApartamentos = new M.style.Category("CATEGORIA", {
        "1 Llave": apartamentosEstrella1,
        "2 Llaves": apartamentosLlaves2,
        "3 Llaves": apartamentosLlaves3,
        "4 Llaves": apartamentosLlaves4,
    });

    let clusterOptionsApartamentos = {
        ranges: [{
            min: 2,
            max: 10,
            style: new M.style.Point({
                stroke: {
                    color: '#471717'
                },
                fill: {
                    color: '#913030',
					 opacity: 0.4
                },
                radius: 12
            })
        }, {
            min: 11,
            max: 20,
            style: new M.style.Point({
                stroke: {
                    color: '#471717'
                },
                fill: {
                    color: '#913030',
					 opacity: 0.4
                },
                radius: 17
            })
        }, {
            min: 21,
            max: 100,
            style: new M.style.Point({
                stroke: {
                    color: '#471717'
                },
                fill: {
                    color: '#913030',
					 opacity: 0.4
                },
                radius: 21
            })
        }, {
            min: 101,
            max: 300,
            style: new M.style.Point({
      ...