[Test] Mapea - fusionar capas2
En vez de pedir las capas por separado, se le piden al Geoserver en una única petición
by deivil79
HTML
<script src="http://mapea4-sigc.juntadeandalucia.es/js/mapea.ol.min.js"></script>
<link rel="stylesheet" href="http://mapea4-sigc.juntadeandalucia.es/assets/css/mapea.ol.min.css">
<script src="http://mapea4-sigc.juntadeandalucia.es/js/configuration.js"></script>
<div id="map"></div>
CSS
html,
body,
#map {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
JavaScript
var mapajs = M.map({
container: "map",
wmcfiles: ["callejero"],
controls: ["layerswitcher"]
});
var todos_features;
var capaGeoJSON = new M.layer.GeoJSON({
name: "Elementos",
url: "http://geostematicos-sigc.juntadeandalucia.es/geoserver/sepim/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=campamentos,ehoteleros&outputFormat=application/json"
});
let ClusterOptions = {
ranges: [{
min: 2,
max: 4,
style: new M.style.Point({
stroke: {
color: '#5789aa'
},
fill: {
color: '#99ccff',
},
radius: 20
})
}, {
min: 5,
max: 9,
style: new M.style.Point({
stroke: {
color: '#5789aa'
},
fill: {
color: '#3399ff',
},
radius: 30
})
}, {
min: 10,
max: 500,
style: new M.style.Point({
stroke: {
color: '#5789aa'
},
fill: {
color: '#004c99',
},
radius: 40
})
}],
animated: true,
hoverInteraction: true,
displayAmount: true,
distance: 80,
maxFeaturesToSelect: 6
};
let ClusterParameters = {
distanceSelectFeatures: 25,
convexHullStyle: {
fill: {
color: '#000000',
opacity: 0.5
},
stroke: {
color: '#000000',
width: 1
}
}
}
capaGeoJSON.setStyle(new M.style.Cluster(ClusterOptions, ClusterParameters));
mapajs.addLayers(capaGeoJSON);