I am working on a heat map that will show by region the number of issues found in which area. The code are not displaying any error on console, my functions which parse my data are ok (I have just debbuged all of them), but for some reason I don't know, the features are not displayed.
This is my code
var listaBairros = document.getElementById("lista-bairros").value;
var lotes = [];
lotes = lotes_parser();
var bairros = assignFeaturesToPolygon();
var styles = [
new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'blue',
width: 3
}),
fill: new ol.style.Fill({
color: 'rgba(0, 0, 255, 0.1)'
})
}),
new ol.style.Style({
image: new ol.style.Circle({
radius: 5,
fill: new ol.style.Fill({
color: 'orange'
})
}),
geometry: function (feature) {
// return the coordinates of the first ring of the polygon
var coordinates = feature.getGeometry().getCoordinates()[0];
return new ol.geom.MultiPoint(coordinates);
}
})
];
var osm = new ol.layer.Tile({
source: new ol.source.OSM()
});
var source = new ol.source.Vector({
features: bairros
});
var layer = new ol.layer.Vector({
source: source,
style: styles
});
var map = new ol.Map({
layers: [osm, layer],
target: 'map',
view: new ol.View({
center: ol.proj.fromLonLat([-46.539028170768447, -23.952416758520052], 'EPSG:3857'),
zoom: 11
})
});
function polygonToArray(entrada) {
var removePolygon = entrada.replace("POLYGON ((", "").replace("))", "");
var points = removePolygon.split(", ");
var finalPoints = [];
points.forEach(function (point) {
var temporaryPoint = point.split(" ");
temporaryPoint[0] = Number(temporaryPoint[0]);
temporaryPoint[1] = parseFloat(temporaryPoint[1]);
finalPoints.push(temporaryPoint);
})
return finalPoints;
}
function assignFeaturesToPolygon() {
var lot = [];
lotes.forEach(function (value, index) {
var new_feature = criarFeature(value);
lot.push(new_feature);
});
return lot;
};
function criarFeature (geometria) {
var feature = new ol.Feature({ geometry: new ol.geom.Polygon([geometria]) });
feature.getGeometry().transform('EPSG:4326', 'EPSG:3857');
return feature;
}
function lotes_parser() {
var bairros_separados = [];
var bairros_parser = listaBairros.split(" _ ");
bairros_parser.forEach(function (lote, index) {
bairros_separados.push(polygonToArray(lote));
});
return bairros_separados;
}
What am I doing wrong?
Before you ask about my projection, that is everything ok with them.
This is the input field that my first line is reading (I used pastebin because is too many characters to write here)
No comments:
Post a Comment