Conjunto ce65723 en sapic


Ignorar:
Fecha y hora:
30/10/2018 14:55:40 (hace 6 años)
Autor:
Ing. Roldan Vargas <roldandvg@…>
Branches:
master
Children:
f4e2775
Parents:
a30b3d7
Mensaje:

agregado axios e instrucciones para la obtención de geometría para agregar capa de comunidades (aún en pruebas)

Ficheros:
4 editados

Leyenda

No modificado
Añadido
Eliminado

  • explicacion_situacional/ajax.py

    r7522254 rce65723  
    1616from django.shortcuts import render, redirect
    1717from django.core.urlresolvers import reverse_lazy
    18 from django.http import JsonResponse
     18from django.http import JsonResponse, HttpResponse
     19from django.core.serializers import serialize
    1920from explicacion_situacional.modelsEncuestas.modelsParticipacion import (
    2021    RespuestaSino, RespuestaOpciones,
    … …  
    4950                              usuario y/o el numero de la encuesta')})
    5051
     52
    5153def cargar_geometria(request):
    52     if not request.is_ajax():
    53         return JsonResponse({'result': False, 'error': str('La solicitud no es ajax')})
     54    try:
     55        comunidad_id = request.GET.get('comunidad_id')
     56        explicacion = ExplicacionSituacional.objects.filter(
     57            fk_organizacion=comunidad_id
     58        )
     59        if (explicacion):
     60            organizacion_social = ExplicacionSituacional.objects.get(
     61                fk_organizacion=comunidad_id
     62            )
    5463
    55     comunidad_id = request.GET.get('comunidad_id')
     64            ## Retorna los datos de la organización social
     65            return HttpResponse(json.dumps({
     66                'result': True,
     67                'coordenadas': str(organizacion_social.coordenadas.geojson),
     68                'comunidad': organizacion_social.fk_organizacion.nombre
     69            }))
     70       
     71        ## Retorna falso si no encuentra información
     72        return HttpResponse(json.dumps({'resultado': False}))
     73    except Exception as e:
     74        return HttpResponse(json.dumps({'resultado': False, 'error': e}))
    5675
    57     if (ExplicacionSituacional.objects.filter(fk_organizacion=comunidad_id)):
    58         organizacion_social = ExplicacionSituacional.objects.get(fk_organizacion=comunidad_id)
    59 
    60         ## Retorna los datos de la organización social
    61         return JsonResponse({'result': True, 'coordenadas': str(organizacion_social.coordenadas.geojson)})
    62 
    63     ## Retorna falso si no encuentra información
    64     return JsonResponse({'result': False})
    65 

  • explicacion_situacional/urls.py

    r7522254 rce65723  
    180180        name="validar_participacion_ajax"
    181181    ),
    182     url(r"^cargar-geometria", cargar_geometria, name="cargar_geometria_ajax"),
     182    url(
     183        r"cargar-geometria/$",
     184        cargar_geometria,
     185        name="cargar_geometria_ajax"
     186    ),
    183187
    184188]

  • static/explicacion_situacional/explicacion_situacional_map.js

    r7522254 rce65723  
    3232function cargar_datos_ubicacion(data_selected) {
    3333    if (data_selected) {
    34         var map = new ol.Map({
    35             target: 'id_coordenadas_div_map'
     34        var image = new ol.style.Circle({
     35            radius: 5,
     36            fill: null,
     37            stroke: new ol.style.Stroke({color: 'red', width: 1})
    3638        });
    37         var vector = new ol.source.Vector({
    38   source: new ol.format.GeoJSON({
    39     url: '/cargar-geometria?comunidad_id='+data_selected
    40   })
    41 });
    42             map.addLayer(vector);
     39        var styles = {
     40            'Point': new ol.style.Style({
     41                image: image
     42            }),
     43            'LineString': new ol.style.Style({
     44                stroke: new ol.style.Stroke({
     45                    color: 'green',
     46                    width: 1
     47                })
     48            }),
     49            'MultiLineString': new ol.style.Style({
     50                stroke: new ol.style.Stroke({
     51                    color: 'green',
     52                    width: 1
     53                })
     54            }),
     55            'MultiPoint': new ol.style.Style({
     56                image: image
     57            }),
     58            'MultiPolygon': new ol.style.Style({
     59                stroke: new ol.style.Stroke({
     60                    color: 'yellow',
     61                    width: 1
     62                }),
     63                fill: new ol.style.Fill({
     64                    color: 'rgba(255, 255, 0, 0.1)'
     65                })
     66            }),
     67            'Polygon': new ol.style.Style({
     68                stroke: new ol.style.Stroke({
     69                    color: 'blue',
     70                    lineDash: [4],
     71                    width: 3
     72                }),
     73                fill: new ol.style.Fill({
     74                    color: 'rgba(0, 0, 255, 0.1)'
     75                })
     76            }),
     77            'GeometryCollection': new ol.style.Style({
     78                stroke: new ol.style.Stroke({
     79                    color: 'magenta',
     80                    width: 2
     81                }),
     82                fill: new ol.style.Fill({
     83                    color: 'magenta'
     84                }),
     85                image: new ol.style.Circle({
     86                    radius: 10,
     87                    fill: null,
     88                    stroke: new ol.style.Stroke({
     89                        color: 'magenta'
     90                    })
     91                })
     92            }),
     93            'Circle': new ol.style.Style({
     94                stroke: new ol.style.Stroke({
     95                    color: 'red',
     96                    width: 2
     97                }),
     98                fill: new ol.style.Fill({
     99                    color: 'rgba(255,0,0,0.2)'
     100                })
     101            })
     102        };
     103        var styleFunction = function(feature) {
     104            console.log(feature.getGeometry().getType())
     105            return styles[feature.getGeometry().getType()];
     106        };
     107        axios.get('/cargar-geometria?comunidad_id='+data_selected)
     108             .then(function (response) {
     109                //console.log(document.getElementById('id_coordenadas_div_map'))
     110                var geojsonObject = {
     111                    'type': 'FeatureCollection',
     112                    'crs': {
     113                        'type': 'name',
     114                        'properties': {
     115                            'name': 'EPSG:3857'
     116                        }
     117                    },
     118                    'features': [{
     119                        'type': 'Feature',
     120                        'geometry': JSON.parse(response.data.coordenadas),
     121                        'properties': {
     122                            'name': 'Comunidad [' + response.data.comunidad + ']'
     123                        }
     124                    }]
     125                };
     126                //console.log(geojsonObject);
     127                /*var map = new ol.Map({
     128                    layers: [new ol.layer.Vector({
     129                        source: new ol.source.Vector({
     130                            features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
     131                        }),
     132                        style: styleFunction
     133                    })],
     134                    target: 'id_coordenadas_div_map',
     135                    controls: ol.control.defaults({
     136                        attributionOptions: {
     137                            collapsible: false
     138                        }
     139                    }),
     140                    view: new ol.View({
     141                        center: [0, 0],
     142                        zoom: 2
     143                    })
     144                });*/
     145                var map = new ol.Map('id_coordenadas_div_map');
     146                map.addLayer(new ol.layer.Vector({
     147                        source: new ol.source.Vector({
     148                            features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
     149                        }),
     150                        style: ol.style.Style({
     151                            stroke: new ol.style.Stroke({
     152                                color: 'blue',
     153                                lineDash: [4],
     154                                width: 3
     155                            }),
     156                            fill: new ol.style.Fill({
     157                                color: 'rgba(0, 0, 255, 0.1)'
     158                            })
     159                        })
     160                    }));
     161                //console.log(response.data.coordenadas);
     162            })
     163             .catch(function (error) {
     164                // handle error
     165                console.log(error);
     166            });
    43167
    44         /*var vector = new ol.layer.Vector({
    45             source: new ol.source.Vector({
    46                 url: '/cargar-geometria?comunidad_id='+data_selected,
    47                 format: new ol.format.GeoJSON()
    48             })
    49         });
    50         console.log(vector)*/
    51         //map.addLayer(vector);
    52 
    53         $.get('/cargar-geometria?comunidad_id='+data_selected).done(function(response){
    54             if (!response.result) {
    55                 // Eliminar capa con poligono de la comunidad
    56                 return false;
    57             }
    58             // Instucciones para cargar capa con datos de la comunidad
    59             /*var geojsonObject = {
    60                 'type': 'FeatureCollection',
    61                 'features': [{
    62                     'type': 'Feature',
    63                     'geometry': JSON.parse(response.coordenadas)
    64                 }]
    65             };
    66             console.log(geojsonObject);
    67             var vectorSource = new ol.source.Vector({
    68                 features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
    69             });
    70             var vector = new ol.layer.Vector({
    71                 source: vectorSource
    72             });*/
    73             /*var vector = new ol.layer.Vector({
    74         source: new ol.source.Vector({
    75           url: '/cargar-geometria?comunidad_id='+data_selected,
    76           format: new ol.format.GeoJSON()
    77         })
    78       });*/
    79             /*var map = new ol.Map({
    80         layers: [vector],
    81         target: 'id_coordenadas_div_map',
    82         zoom: 2
    83       });*/
    84             /*var vector = new ol.layer.Vector({
    85                 title: 'Comunidad',
    86                 source: new ol.source.Vector({
    87                     features: (new ol.format.GeoJSON()).readFeatures(response.coordenadas)
    88                 })
    89             });*/
    90 
    91             //console.log(map);
    92             //console.log(response.coordenadas);
    93         }).fail(function(response){
    94             console.log(response.error);
    95         });
    96168    }
    97169}

  • utils/templates/base.html

    rb841f95 rce65723  
    5757        {% block extrajs %}{% endblock extrajs %}
    5858        <!-- Fin de los js extras -->
     59        <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    5960    </head>
    6061    <!-- Fin Bloque Head -->
Nota: Vea TracChangeset para ayuda en el uso del visor de conjuntos de cambios.