Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
GeoInt_SIDT
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Mario Chirinos Colunga
GeoInt_SIDT
Commits
8042167f
Commit
8042167f
authored
May 24, 2018
by
Emmanuel René Huchim Puc
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
draw the biggest polygon and more stuff
parent
1ec08d39
Changes
2
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
75 additions
and
17 deletions
+75
-17
dataRetrieval.js
catalog/static/js/dataRetrieval.js
+13
-5
openLayers4.js
catalog/static/js/openLayers4.js
+62
-12
No files found.
catalog/static/js/dataRetrieval.js
View file @
8042167f
...
...
@@ -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({
...
...
catalog/static/js/openLayers4.js
View file @
8042167f
...
...
@@ -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
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment