draw the biggest polygon and more stuff

parent 1ec08d39
......@@ -55,7 +55,6 @@ var makeRequest = function (value) {
},
dataType: 'json',
success: function(data) {
console.log("DATA: ", data.polygonList);
polygonList = data.polygonList;
while (pol_element.firstChild) {
......@@ -75,9 +74,19 @@ var makeRequest = function (value) {
};
function drawPolygon(element) {
polygonList.forEach(function (pol) {
if (pol.id === element.id) {
console.log(pol);
polygonList.forEach(function (polygon) {
if (polygon.id === element.id) {
// remove prev polygon
osmap.removePolygon();
// format coords to draw
var coords = osmap.formatCoords(polygon.geojson.geometry.coordinates);
// get the biggest area
var biggest = osmap.getBiggestPolygon(coords);
// draw coords
osmap.addPolygon(biggest);
}
})
}
......@@ -138,7 +147,6 @@ $(document).ready(function () {
return
}
console.log(value);
// console.log("TOKEN: ", document.getElementsByName('csrfmiddlewaretoken')[0].value);
makeRequest(value);
// $.ajax({
......
......@@ -87,29 +87,71 @@ OpenStreetMapsClass.prototype.geolocation = function()
*/
OpenStreetMapsClass.prototype.addPolygon = function(coords)
{
// formar coords
var polyCoords = [];
for (var index in coords) {
var c = coords[index];
polyCoords.push(ol.proj.fromLonLat([parseFloat(c[0]), parseFloat(c[1])], 'EPSG:3857', 'EPSG:4326'));
}
// remove previous layers
this.vectorLayer.getSource().clear();
// create feature
var feature = new ol.Feature({
geometry: new ol.geom.Polygon([polyCoords])
geometry: new ol.geom.Polygon(coords)
})
// add feature to map with zoom animation
// fit zoom with animation
this.map.getView().fit(feature.getGeometry(), {duration: 1000, padding: [0, 0, 70, 0]});
// add feature to map
this.vectorLayer.getSource().addFeature(feature);
// show coords
document.getElementById("id_polygon").value = feature.getGeometry().clone().transform( 'EPSG:3857', 'EPSG:4326').getCoordinates();
}
//------------------------------------------------------------------------------
/**
* calculate the area of each polygon and return the coords of the biggest polygon
* @param coords polygons coords
* @return biggest coords of the biggest polygon
*/
OpenStreetMapsClass.prototype.getBiggestPolygon = function(coords)
{
if (coords.length <= 1) { return coords; }
// calculate areas
var areas = [];
for (var index in coords) {
var polygon = new ol.geom.Polygon([coords[index]]);
var area = ol.Sphere.getArea(polygon);
areas.push(area);
}
// get coords with max area
var max = Math.max.apply(null, areas);
var biggest = coords[areas.indexOf(max)];
return [biggest];
}
//------------------------------------------------------------------------------
/**
* format database coords to openlayers coords
* @param coords database coords array
* @return formatCoords coords with correct format
*/
OpenStreetMapsClass.prototype.formatCoords = function(coords)
{
var formatCoords = [];
// algunos municipios tienes regiones separadas (campeche tiene 4, merida tiene 1)
for (var index = coords.length - 1; index >= 0; index--) {
var regionCoords = [];
var region = coords[index][0];
// se formatea las coordenadas de una region
for (var regionIndex = region.length - 1; regionIndex >= 0; regionIndex--) {
var c = region[regionIndex];
regionCoords.push(ol.proj.fromLonLat([parseFloat(c[0]), parseFloat(c[1])], 'EPSG:3857', 'EPSG:4326'));
}
formatCoords.push(regionCoords);
}
return formatCoords;
}
//------------------------------------------------------------------------------
/**
* set value in input with wkt format
* POLYGON ((30 10, 40 40, 20 40, 10 20, 30 10))
......@@ -121,6 +163,14 @@ OpenStreetMapsClass.prototype.setPolygonInputValue = function(coords)
// todo
}
//------------------------------------------------------------------------------
/**
* delete current polygon in map
*/
OpenStreetMapsClass.prototype.removePolygon = function()
{
this.vectorLayer.getSource().clear();
}
//------------------------------------------------------------------------------
/**
* @param lng Longitude
* @param lat Latitude
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment