Commit f9566ff8 authored by Rodrigo Tapia-McClung's avatar Rodrigo Tapia-McClung

Merge branch 'dev' into 'master'

Stable version of Grijalva, centro_pais, and evolucion_urbana

See merge request !1
parents f7d924f2 ef94540a
......@@ -67,7 +67,7 @@ NodeJS requests will be routed to port 8090 :)
## Installation
If you don't have git, you can donwload [a zip file](http://gitlab.geoint.mx/tapiamcclung/fordecyt2019/-/archive/master/fordecyt2019-master.zip) of the project instead.
If you don't have git, you can download [a zip file](http://gitlab.geoint.mx/tapiamcclung/fordecyt2019/-/archive/master/fordecyt2019-master.zip) of the project instead.
git clone this_repository
cd this_repository
......@@ -75,6 +75,8 @@ If you don't have git, you can donwload [a zip file](http://gitlab.geoint.mx/tap
cp config/dbconfig.example.json config/dbconfig.json
# now edit config/dbconfig.json for your PostGIS database
node pgserver.js
or
npm run dev / npm run start
# point your browser to [http://localhost:8090](http://localhost:8090) for more info
### Attributions
......
{
"type": "FeatureCollection",
"name": "od",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_mun": 1001, "cve_ent": 1, "nombre": "Aguascalientes", "lng": -102.296111, "lat": 21.880833 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_mun": 1011, "cve_ent": 1, "nombre": "San Francisco de los Romo", "lng": -102.270278, "lat": 22.0725 }, "geometry": { "type": "Point", "coordinates": [ -102.270278, 22.0725 ] } },
{ "type": "Feature", "properties": { "id_mun": 1005, "cve_ent": 1, "nombre": "Jesús María", "lng": -102.343333, "lat": 21.961111 }, "geometry": { "type": "Point", "coordinates": [ -102.343333, 21.961111 ] } },
{ "type": "Feature", "properties": { "id_mun": 11007, "cve_ent": 11, "nombre": "Celaya", "lng": -100.815, "lat": 20.528889 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_mun": 11020, "cve_ent": 11, "nombre": "León", "lng": -101.680556, "lat": 21.119722 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_mun": 11017, "cve_ent": 11, "nombre": "Irapuato", "lng": -101.3475, "lat": 20.674167 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_mun": 11011, "cve_ent": 11, "nombre": "Cortazar", "lng": -100.941667, "lat": 20.433333 }, "geometry": { "type": "Point", "coordinates": [ -100.941667, 20.433333 ] } },
{ "type": "Feature", "properties": { "id_mun": 11027, "cve_ent": 11, "nombre": "Salamanca", "lng": -101.195717, "lat": 20.573931 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_mun": 11044, "cve_ent": 11, "nombre": "Villagrán", "lng": -100.996389, "lat": 20.511111 }, "geometry": { "type": "Point", "coordinates": [ -100.996389, 20.511111 ] } },
{ "type": "Feature", "properties": { "id_mun": 11015, "cve_ent": 11, "nombre": "Guanajuato", "lng": -101.256667, "lat": 21.017778 }, "geometry": { "type": "Point", "coordinates": [ -101.256667, 21.017778 ] } },
{ "type": "Feature", "properties": { "id_mun": 11031, "cve_ent": 11, "nombre": "San Francisco del Rincón", "lng": -101.857778, "lat": 21.018333 }, "geometry": { "type": "Point", "coordinates": [ -101.857778, 21.018333 ] } },
{ "type": "Feature", "properties": { "id_mun": 11037, "cve_ent": 11, "nombre": "Silao", "lng": -101.426667, "lat": 20.943611 }, "geometry": { "type": "Point", "coordinates": [ -101.426667, 20.943611 ] } },
{ "type": "Feature", "properties": { "id_mun": 11003, "cve_ent": 11, "nombre": "San Miguel de Allende", "lng": -100.743889, "lat": 20.915278 }, "geometry": { "type": "Point", "coordinates": [ -100.743889, 20.915278 ] } },
{ "type": "Feature", "properties": { "id_mun": 11009, "cve_ent": 11, "nombre": "Comonfort", "lng": -100.791667, "lat": 20.716667 }, "geometry": { "type": "Point", "coordinates": [ -100.791667, 20.716667 ] } },
{ "type": "Feature", "properties": { "id_mun": 11004, "cve_ent": 11, "nombre": "Apaseo el Alto", "lng": -100.621667, "lat": 20.455556 }, "geometry": { "type": "Point", "coordinates": [ -100.621667, 20.455556 ] } },
{ "type": "Feature", "properties": { "id_mun": 11025, "cve_ent": 11, "nombre": "Purísima del Rincón", "lng": -101.879167, "lat": 21.030556 }, "geometry": { "type": "Point", "coordinates": [ -101.879167, 21.030556 ] } },
{ "type": "Feature", "properties": { "id_mun": 16069, "cve_ent": 16, "nombre": "La Piedad", "lng": -102.017, "lat": 20.3333 }, "geometry": { "type": "Point", "coordinates": [ -102.017, 20.3333 ] } },
{ "type": "Feature", "properties": { "id_mun": 22014, "cve_ent": 22, "nombre": "Querétaro", "lng": -100.391, "lat": 20.591 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_mun": 22016, "cve_ent": 22, "nombre": "San Juan del Río", "lng": -99.996389, "lat": 20.388889 }, "geometry": { "type": "Point", "coordinates": [ -99.996389, 20.388889 ] } },
{ "type": "Feature", "properties": { "id_mun": 22006, "cve_ent": 22, "nombre": "Corregidora", "lng": -100.442, "lat": 20.531 }, "geometry": { "type": "Point", "coordinates": [ -100.442, 20.531 ] } },
{ "type": "Feature", "properties": { "id_mun": 22011, "cve_ent": 22, "nombre": "El Marqués", "lng": -100.275248, "lat": 20.687706 }, "geometry": { "type": "Point", "coordinates": [ -100.275248, 20.687706 ] } },
{ "type": "Feature", "properties": { "id_mun": 22008, "cve_ent": 22, "nombre": "Huimilpan", "lng": -100.283333, "lat": 20.366667 }, "geometry": { "type": "Point", "coordinates": [ -100.283333, 20.366667 ] } },
{ "type": "Feature", "properties": { "id_mun": 24028, "cve_ent": 24, "nombre": "San Luis Potosí", "lng": -100.975, "lat": 22.149722 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_mun": 24035, "cve_ent": 24, "nombre": "Soledad de Graciano Sánchez", "lng": -100.940833, "lat": 22.183056 }, "geometry": { "type": "Point", "coordinates": [ -100.940833, 22.183056 ] } },
{ "type": "Feature", "properties": { "id_mun": 24055, "cve_ent": 24, "nombre": "Zaragoza", "lng": -100.729722, "lat": 22.039722 }, "geometry": { "type": "Point", "coordinates": [ -100.729722, 22.039722 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_POIC_desde",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 1412, "id_destino": 11037, "muni_destino": "Silao", "xd": -101.426667, "yd": 20.943611, "personas": 1412 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 1325, "id_destino": 22011, "muni_destino": "El Marqués", "xd": -100.275248, "yd": 20.687706, "personas": 1325 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "ocupados": "Secundario", "viajes": 1046, "id_destino": 24035, "muni_destino": "Soledad de Graciano Sánchez", "xd": -100.940833, "yd": 22.183056, "personas": 1046 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Terciario", "viajes": 886, "id_destino": 1011, "muni_destino": "San Francisco de los Romo", "xd": -102.270278, "yd": 22.0725, "personas": 886 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 827, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 827 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 716, "id_destino": 11031, "muni_destino": "San Francisco del Rincón", "xd": -101.857778, "yd": 21.018333, "personas": 716 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Terciario", "viajes": 676, "id_destino": 1005, "muni_destino": "Jesús María", "xd": -102.343333, "yd": 21.961111, "personas": 676 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 449, "id_destino": 22016, "muni_destino": "San Juan del Río", "xd": -99.996389, "yd": 20.388889, "personas": 449 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 391, "id_destino": 22006, "muni_destino": "Corregidora", "xd": -100.442, "yd": 20.531, "personas": 391 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 277, "id_destino": 22008, "muni_destino": "Huimilpan", "xd": -100.283333, "yd": 20.366667, "personas": 277 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 231, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 231 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 220, "id_destino": 11025, "muni_destino": "Purísima del Rincón", "xd": -101.879167, "yd": 21.030556, "personas": 220 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 189, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 189 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 168, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 168 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Terciario", "viajes": 151, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 151 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "ocupados": "Secundario", "viajes": 147, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 147 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "ocupados": "Secundario", "viajes": 114, "id_destino": 24024, "muni_destino": "Ríoverde", "xd": -99.99169, "yd": 21.93032, "personas": 114 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 104, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 104 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_POIC_entre",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 1158, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 1158 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 1107, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 1107 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 941, "id_destino": 11031, "muni_destino": "San Francisco del Rincón", "xd": -101.857778, "yd": 21.018333, "personas": 941 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 660, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 660 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 624, "id_destino": 22016, "muni_destino": "San Juan del Río", "xd": -99.996389, "yd": 20.388889, "personas": 624 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 22016, "muni_origen": "San Juan del Río", "xo": -99.996389, "yo": 20.388889, "viajes": 611, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 611 }, "geometry": { "type": "Point", "coordinates": [ -99.996389, 20.388889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11031, "muni_origen": "San Francisco del Rincón", "xo": -101.857778, "yo": 21.018333, "viajes": 456, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 456 }, "geometry": { "type": "Point", "coordinates": [ -101.857778, 21.018333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 440, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 440 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11027, "muni_origen": "Salamanca", "xo": -101.195717, "yo": 20.573931, "viajes": 363, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 363 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 352, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 352 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 340, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 340 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 306, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 306 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 291, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 291 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 291, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 291 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 287, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 287 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 266, "id_destino": 11003, "muni_destino": "San Miguel de Allende", "xd": -100.743889, "yd": 20.915278, "personas": 266 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11015, "muni_origen": "Guanajuato", "xo": -101.256667, "yo": 21.017778, "viajes": 189, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 189 }, "geometry": { "type": "Point", "coordinates": [ -101.256667, 21.017778 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "viajes": 179, "id_destino": 24024, "muni_destino": "Ríoverde", "xd": -99.99169, "yd": 21.93032, "personas": 179 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "viajes": 164, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 164 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 11027, "muni_origen": "Salamanca", "xo": -101.195717, "yo": 20.573931, "viajes": 163, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 163 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "viajes": 157, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 157 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_POIC_hacia",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 22006, "muni_origen": "Corregidora", "xo": -100.442, "yo": 20.531, "ocupados": "Primario", "viajes": 10612, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 10612 }, "geometry": { "type": "Point", "coordinates": [ -100.442, 20.531 ] } },
{ "type": "Feature", "properties": { "id_origen": 24035, "muni_origen": "Soledad de Graciano Sánchez", "xo": -100.940833, "yo": 22.183056, "ocupados": "Secundario", "viajes": 8886, "id_destino": 24028, "muni_destino": "San Luis Potosí", "xd": -100.975, "yd": 22.149722, "personas": 8886 }, "geometry": { "type": "Point", "coordinates": [ -100.940833, 22.183056 ] } },
{ "type": "Feature", "properties": { "id_origen": 1005, "muni_origen": "Jesús María", "xo": -102.343333, "yo": 21.961111, "ocupados": "Terciario", "viajes": 2836, "id_destino": 1001, "muni_destino": "Aguascalientes", "xd": -102.296111, "yd": 21.880833, "personas": 2836 }, "geometry": { "type": "Point", "coordinates": [ -102.343333, 21.961111 ] } },
{ "type": "Feature", "properties": { "id_origen": 22011, "muni_origen": "El Marqués", "xo": -100.275248, "yo": 20.687706, "ocupados": "Primario", "viajes": 2610, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 2610 }, "geometry": { "type": "Point", "coordinates": [ -100.275248, 20.687706 ] } },
{ "type": "Feature", "properties": { "id_origen": 22016, "muni_origen": "San Juan del Río", "xo": -99.996389, "yo": 20.388889, "ocupados": "Primario", "viajes": 499, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 499 }, "geometry": { "type": "Point", "coordinates": [ -99.996389, 20.388889 ] } },
{ "type": "Feature", "properties": { "id_origen": 1011, "muni_origen": "San Francisco de los Romo", "xo": -102.270278, "yo": 22.0725, "ocupados": "Terciario", "viajes": 494, "id_destino": 1001, "muni_destino": "Aguascalientes", "xd": -102.296111, "yd": 21.880833, "personas": 494 }, "geometry": { "type": "Point", "coordinates": [ -102.270278, 22.0725 ] } },
{ "type": "Feature", "properties": { "id_origen": 11037, "muni_origen": "Silao", "xo": -101.426667, "yo": 20.943611, "ocupados": "Terciario", "viajes": 480, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 480 }, "geometry": { "type": "Point", "coordinates": [ -101.426667, 20.943611 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Terciario", "viajes": 349, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 349 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11031, "muni_origen": "San Francisco del Rincón", "xo": -101.857778, "yo": 21.018333, "ocupados": "Terciario", "viajes": 329, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 329 }, "geometry": { "type": "Point", "coordinates": [ -101.857778, 21.018333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Primario", "viajes": 283, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 283 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 22008, "muni_origen": "Huimilpan", "xo": -100.283333, "yo": 20.366667, "ocupados": "Primario", "viajes": 198, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 198 }, "geometry": { "type": "Point", "coordinates": [ -100.283333, 20.366667 ] } },
{ "type": "Feature", "properties": { "id_origen": 11004, "muni_origen": "Apaseo el Alto", "xo": -100.621667, "yo": 20.455556, "ocupados": "Primario", "viajes": 160, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 160 }, "geometry": { "type": "Point", "coordinates": [ -100.621667, 20.455556 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Terciario", "viajes": 151, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 151 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "ocupados": "Primario", "viajes": 147, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 147 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11015, "muni_origen": "Guanajuato", "xo": -101.256667, "yo": 21.017778, "ocupados": "Terciario", "viajes": 127, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 127 }, "geometry": { "type": "Point", "coordinates": [ -101.256667, 21.017778 ] } },
{ "type": "Feature", "properties": { "id_origen": 11003, "muni_origen": "San Miguel de Allende", "xo": -100.743889, "yo": 20.915278, "ocupados": "Primario", "viajes": 119, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 119 }, "geometry": { "type": "Point", "coordinates": [ -100.743889, 20.915278 ] } },
{ "type": "Feature", "properties": { "id_origen": 11025, "muni_origen": "Purísima del Rincón", "xo": -101.879167, "yo": 21.030556, "ocupados": "Terciario", "viajes": 117, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 117 }, "geometry": { "type": "Point", "coordinates": [ -101.879167, 21.030556 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 102, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 102 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_desde",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Terciario", "viajes": 7164, "id_destino": 11037, "muni_destino": "Silao", "xd": -101.426667, "yd": 20.943611, "personas": 7164 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 4226, "id_destino": 22011, "muni_destino": "El Marqués", "xd": -100.275248, "yd": 20.687706, "personas": 4226 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Primario", "viajes": 4180, "id_destino": 11037, "muni_destino": "Silao", "xd": -101.426667, "yd": 20.943611, "personas": 4180 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Secundario", "viajes": 3322, "id_destino": 1005, "muni_destino": "Jesús María", "xd": -102.343333, "yd": 21.961111, "personas": 3322 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 1001, "muni_origen": "Aguascalientes", "xo": -102.296111, "yo": 21.880833, "ocupados": "Secundario", "viajes": 3201, "id_destino": 1011, "muni_destino": "San Francisco de los Romo", "xd": -102.270278, "yd": 22.0725, "personas": 3201 }, "geometry": { "type": "Point", "coordinates": [ -102.296111, 21.880833 ] } },
{ "type": "Feature", "properties": { "id_origen": 24028, "muni_origen": "San Luis Potosí", "xo": -100.975, "yo": 22.149722, "ocupados": "Secundario", "viajes": 3179, "id_destino": 24035, "muni_destino": "Soledad de Graciano Sánchez", "xd": -100.940833, "yd": 22.183056, "personas": 3179 }, "geometry": { "type": "Point", "coordinates": [ -100.975, 22.149722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Terciario", "viajes": 3079, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 3079 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Primario", "viajes": 2635, "id_destino": 11031, "muni_destino": "San Francisco del Rincón", "xd": -101.857778, "yd": 21.018333, "personas": 2635 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 2247, "id_destino": 22006, "muni_destino": "Corregidora", "xd": -100.442, "yd": 20.531, "personas": 2247 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 1301, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 1301 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Primario", "viajes": 1286, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 1286 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Terciario", "viajes": 807, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 807 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 802, "id_destino": 22016, "muni_destino": "San Juan del Río", "xd": -99.996389, "yd": 20.388889, "personas": 802 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 731, "id_destino": 11044, "muni_destino": "Villagrán", "xd": -100.996389, "yd": 20.511111, "personas": 731 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Terciario", "viajes": 729, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 729 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "ocupados": "Primario", "viajes": 695, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 695 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 660, "id_destino": 11011, "muni_destino": "Cortazar", "xd": -100.941667, "yd": 20.433333, "personas": 660 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Primario", "viajes": 643, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 643 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 623, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 623 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Terciario", "viajes": 578, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 578 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_entre",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 7893, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 7893 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 3079, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 3079 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11031, "muni_origen": "San Francisco del Rincón", "xo": -101.857778, "yo": 21.018333, "viajes": 2549, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 2549 }, "geometry": { "type": "Point", "coordinates": [ -101.857778, 21.018333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 2523, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 2523 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 2099, "id_destino": 11031, "muni_destino": "San Francisco del Rincón", "xd": -101.857778, "yd": 21.018333, "personas": 2099 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 22016, "muni_origen": "San Juan del Río", "xo": -99.996389, "yo": 20.388889, "viajes": 2077, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 2077 }, "geometry": { "type": "Point", "coordinates": [ -99.996389, 20.388889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 2061, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 2061 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 1978, "id_destino": 11027, "muni_destino": "Salamanca", "xd": -101.195717, "yd": 20.573931, "personas": 1978 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11027, "muni_origen": "Salamanca", "xo": -101.195717, "yo": 20.573931, "viajes": 1670, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 1670 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_origen": 11027, "muni_origen": "Salamanca", "xo": -101.195717, "yo": 20.573931, "viajes": 1597, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 1597 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 1475, "id_destino": 11003, "muni_destino": "San Miguel de Allende", "xd": -100.743889, "yd": 20.915278, "personas": 1475 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 1370, "id_destino": 22016, "muni_destino": "San Juan del Río", "xd": -99.996389, "yd": 20.388889, "personas": 1370 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11015, "muni_origen": "Guanajuato", "xo": -101.256667, "yo": 21.017778, "viajes": 1317, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 1317 }, "geometry": { "type": "Point", "coordinates": [ -101.256667, 21.017778 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 1283, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 1283 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "viajes": 1073, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 1073 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 22014, "muni_origen": "Querétaro", "xo": -100.391, "yo": 20.591, "viajes": 1067, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 1067 }, "geometry": { "type": "Point", "coordinates": [ -100.391, 20.591 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "viajes": 807, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 807 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 734, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 734 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11003, "muni_origen": "San Miguel de Allende", "xo": -100.743889, "yo": 20.915278, "viajes": 622, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 622 }, "geometry": { "type": "Point", "coordinates": [ -100.743889, 20.915278 ] } },
{ "type": "Feature", "properties": { "id_origen": 16069, "muni_origen": "La Piedad", "xo": -102.017, "yo": 20.3333, "viajes": 608, "id_destino": 11015, "muni_destino": "Guanajuato", "xd": -101.256667, "yd": 21.017778, "personas": 608 }, "geometry": { "type": "Point", "coordinates": [ -102.017, 20.3333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "viajes": 514, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 514 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } }
]
}
{
"type": "FeatureCollection",
"name": "viajes_ocupados_hacia",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_origen": 24035, "muni_origen": "Soledad de Graciano Sánchez", "xo": -100.940833, "yo": 22.183056, "ocupados": "Secundario", "viajes": 53298, "id_destino": 24028, "muni_destino": "San Luis Potosí", "xd": -100.975, "yd": 22.149722, "personas": 53298 }, "geometry": { "type": "Point", "coordinates": [ -100.940833, 22.183056 ] } },
{ "type": "Feature", "properties": { "id_origen": 22006, "muni_origen": "Corregidora", "xo": -100.442, "yo": 20.531, "ocupados": "Primario", "viajes": 32663, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 32663 }, "geometry": { "type": "Point", "coordinates": [ -100.442, 20.531 ] } },
{ "type": "Feature", "properties": { "id_origen": 22011, "muni_origen": "El Marqués", "xo": -100.275248, "yo": 20.687706, "ocupados": "Primario", "viajes": 20108, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 20108 }, "geometry": { "type": "Point", "coordinates": [ -100.275248, 20.687706 ] } },
{ "type": "Feature", "properties": { "id_origen": 1005, "muni_origen": "Jesús María", "xo": -102.343333, "yo": 21.961111, "ocupados": "Secundario", "viajes": 16934, "id_destino": 1001, "muni_destino": "Aguascalientes", "xd": -102.296111, "yd": 21.880833, "personas": 16934 }, "geometry": { "type": "Point", "coordinates": [ -102.343333, 21.961111 ] } },
{ "type": "Feature", "properties": { "id_origen": 11004, "muni_origen": "Apaseo el Alto", "xo": -100.621667, "yo": 20.455556, "ocupados": "Primario", "viajes": 5586, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 5586 }, "geometry": { "type": "Point", "coordinates": [ -100.621667, 20.455556 ] } },
{ "type": "Feature", "properties": { "id_origen": 11037, "muni_origen": "Silao", "xo": -101.426667, "yo": 20.943611, "ocupados": "Primario", "viajes": 4993, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 4993 }, "geometry": { "type": "Point", "coordinates": [ -101.426667, 20.943611 ] } },
{ "type": "Feature", "properties": { "id_origen": 11009, "muni_origen": "Comonfort", "xo": -100.791667, "yo": 20.716667, "ocupados": "Terciario", "viajes": 4755, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 4755 }, "geometry": { "type": "Point", "coordinates": [ -100.791667, 20.716667 ] } },
{ "type": "Feature", "properties": { "id_origen": 1011, "muni_origen": "San Francisco de los Romo", "xo": -102.270278, "yo": 22.0725, "ocupados": "Secundario", "viajes": 4375, "id_destino": 1001, "muni_destino": "Aguascalientes", "xd": -102.296111, "yd": 21.880833, "personas": 4375 }, "geometry": { "type": "Point", "coordinates": [ -102.270278, 22.0725 ] } },
{ "type": "Feature", "properties": { "id_origen": 22008, "muni_origen": "Huimilpan", "xo": -100.283333, "yo": 20.366667, "ocupados": "Primario", "viajes": 3934, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 3934 }, "geometry": { "type": "Point", "coordinates": [ -100.283333, 20.366667 ] } },
{ "type": "Feature", "properties": { "id_origen": 11044, "muni_origen": "Villagrán", "xo": -100.996389, "yo": 20.511111, "ocupados": "Terciario", "viajes": 3916, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 3916 }, "geometry": { "type": "Point", "coordinates": [ -100.996389, 20.511111 ] } },
{ "type": "Feature", "properties": { "id_origen": 24055, "muni_origen": "Zaragoza", "xo": -100.729722, "yo": 22.039722, "ocupados": "Secundario", "viajes": 3823, "id_destino": 24028, "muni_destino": "San Luis Potosí", "xd": -100.975, "yd": 22.149722, "personas": 3823 }, "geometry": { "type": "Point", "coordinates": [ -100.729722, 22.039722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11031, "muni_origen": "San Francisco del Rincón", "xo": -101.857778, "yo": 21.018333, "ocupados": "Primario", "viajes": 1981, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 1981 }, "geometry": { "type": "Point", "coordinates": [ -101.857778, 21.018333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11027, "muni_origen": "Salamanca", "xo": -101.195717, "yo": 20.573931, "ocupados": "Terciario", "viajes": 1670, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 1670 }, "geometry": { "type": "Point", "coordinates": [ -101.195717, 20.573931 ] } },
{ "type": "Feature", "properties": { "id_origen": 22016, "muni_origen": "San Juan del Río", "xo": -99.996389, "yo": 20.388889, "ocupados": "Primario", "viajes": 1636, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 1636 }, "geometry": { "type": "Point", "coordinates": [ -99.996389, 20.388889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11007, "muni_origen": "Celaya", "xo": -100.815, "yo": 20.528889, "ocupados": "Primario", "viajes": 1301, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 1301 }, "geometry": { "type": "Point", "coordinates": [ -100.815, 20.528889 ] } },
{ "type": "Feature", "properties": { "id_origen": 11011, "muni_origen": "Cortazar", "xo": -100.941667, "yo": 20.433333, "ocupados": "Terciario", "viajes": 751, "id_destino": 11007, "muni_destino": "Celaya", "xd": -100.815, "yd": 20.528889, "personas": 751 }, "geometry": { "type": "Point", "coordinates": [ -100.941667, 20.433333 ] } },
{ "type": "Feature", "properties": { "id_origen": 11017, "muni_origen": "Irapuato", "xo": -101.3475, "yo": 20.674167, "ocupados": "Primario", "viajes": 729, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 729 }, "geometry": { "type": "Point", "coordinates": [ -101.3475, 20.674167 ] } },
{ "type": "Feature", "properties": { "id_origen": 11009, "muni_origen": "Comonfort", "xo": -100.791667, "yo": 20.716667, "ocupados": "Primario", "viajes": 686, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 686 }, "geometry": { "type": "Point", "coordinates": [ -100.791667, 20.716667 ] } },
{ "type": "Feature", "properties": { "id_origen": 11020, "muni_origen": "León", "xo": -101.680556, "yo": 21.119722, "ocupados": "Terciario", "viajes": 643, "id_destino": 11017, "muni_destino": "Irapuato", "xd": -101.3475, "yd": 20.674167, "personas": 643 }, "geometry": { "type": "Point", "coordinates": [ -101.680556, 21.119722 ] } },
{ "type": "Feature", "properties": { "id_origen": 11003, "muni_origen": "San Miguel de Allende", "xo": -100.743889, "yo": 20.915278, "ocupados": "Primario", "viajes": 622, "id_destino": 22014, "muni_destino": "Querétaro", "xd": -100.391, "yd": 20.591, "personas": 622 }, "geometry": { "type": "Point", "coordinates": [ -100.743889, 20.915278 ] } },
{ "type": "Feature", "properties": { "id_origen": 11025, "muni_origen": "Purísima del Rincón", "xo": -101.879167, "yo": 21.030556, "ocupados": "Primario", "viajes": 506, "id_destino": 11020, "muni_destino": "León", "xd": -101.680556, "yd": 21.119722, "personas": 506 }, "geometry": { "type": "Point", "coordinates": [ -101.879167, 21.030556 ] } }
]
}
......@@ -2,22 +2,20 @@
<html>
<head>
<meta charset='utf-8' />
<title>Crecimiento urbano en la regi&oacute;n metropolitana centro pa&iacute</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<meta charset="utf-8" />
<title>Crecimiento urbano en la regi&oacute;n metropolitana centro pa&iacute;s</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" />
<link rel="stylesheet" href="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.control.min.css" />
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css' rel='stylesheet' />
<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="../js/L.VisualClick/L.VisualClick.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css" />
<link rel="stylesheet" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css" />
<link rel="stylesheet" href="../js/L.VisualClick/L.VisualClick.css" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css" />
<link rel="stylesheet" type="text/css" href="../css/riesgos/style.css">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="icon" href="../img/grijalva.png" sizes="16x16">
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="../css/fontawesome.css" />
<link rel="icon" href="../img/urban.jpeg" sizes="16x16" />
</head>
<body>
......@@ -31,15 +29,13 @@
<p class="lead">Consulta el crecimiento de los aglomerados urbanos del Corredor Metropolitano Centro Pa&iacute;s resultado del an&aacute;lisis de im&aacute;genes &oacute;pticas de Sentinel-2 y conoce los indicadores que caracterizan su evoluci&oacute;n econ&oacute;mica
en las &uacute;ltimas d&eacute;cadas.</p>
<hr class="my-4">
<p>Escoge las fechas para las que quieres explorar el contenido de agua y sus indicadores.</p>
<div class="container">
<div class="row justify-content-center">
<div class="col-4 text-center">
<input type="text" name="date-initial" id="date-initial" readonly="readonly" size="12" placeholder="Fecha inicial" data-calendar="false" />
<button type="button" class="btn btn-primary btn-lg" id="showFlows">Ver flujos</button>
</div>
<div class="col-4 text-center">
<input type="text" name="date-final" id="date-final" readonly="readonly" size="12" placeholder="Fecha final" data-calendar="true" />
<button type="button" class="btn btn-primary btn-lg" id="showUrban">Ver urbanizaci&oacute;n</button>
</div>
</div>
</div>
......@@ -47,8 +43,9 @@
</div>
<div class="d-flex flex-column" id="mainContainer">
<header class="page-header py-2">
<div class="container text-center">
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
<a class="navbar-brand mr-0 mr-md-2" href="." aria-label="Regresar"><i class="fas fa-arrow-left"></i></a>
<div class="navbar-nav mx-auto">
<div class="row align-items-center text-center" id="title">
<h2>Crecimiento urbano en la regi&oacute;n metropolitana centro pa&iacute;s</h2>
</div>
......@@ -58,9 +55,7 @@
<!-- middle container -->
<div class="container-fluid d-flex flex-fill">
<div class="row d-flex flex-fill">
<div class="col-md-6" id="mexmap">
<!-- <div class="col-md-10" id="mexmap"> -->
<div id="datePickers"></div>
<div class="col-6" id="mexmap">
<div class="picker">
<select id="indicatorSelect"></select>
</div>
......@@ -73,23 +68,44 @@
</div>
</div>
<div class="col-md-6" id="overlaydiv"></div>
<div class="col-md-6" id="story">
<div class="col-6" id="overlaydiv"></div>
<div class="col-6" id="story">
<div class="loader"></div>
<div class="row h-50 border-bottom">
<div class="col-6 border-right">
<div id="area-graph"></div>
</div>
<div class="col-6">
<div id="perimeter-graph"></div>
<div class="col" id="topChart">
<div class="row h-100">
<div id="odChart"></div>
<div id="barChart"></div>
</div>
</div>
</div>
<div class="row h-50">
<div class="col-6 border-right">
<div id="costa-graph"></div>
<div class="col-6 border-right" id="bottomLeftChart">
<div class="row h-100">
<div id="chordChart"></div>
<div id="pieChart"></div>
</div>
</div>
<div class="col-6">
<div id="df-graph"></div>
<div class="col-6 align-self-center" id="odTableRow">
<div class="row h-100 justify-content-center" id="bottomRightChart">
<div id="radarChart"></div>
<div class="card text-center" id="odCard">
<div class="card-body">
<p class="card-text">Haz clic en un nodo del mapa para mostrar sus datos</p>
</div>
</div>
<table class="table table-dark table-striped table-fixed" id="tblViajes">
<thead class="thead-dark">
<tr>
<th scope="col">Origen</th>
<th scope="col">Destino</th>
<th scope="col">Viajes</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
......@@ -135,25 +151,55 @@
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"></script>
<script src="../js/Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.js"></script>
<script src="../js/L.VisualClick/L.VisualClick.js"></script>
<script src="https://api.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.3.1/leaflet-omnivore.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/2.0.3/chroma.min.js"></script>
<script src="https://d3js.org/d3.v5.min.js"></script>
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js'></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js"></script>
<script src="https://unpkg.com/mapbox-gl-leaflet/leaflet-mapbox-gl.js"></script>
<script type="text/javascript" src="../js/Leaflet.Sync.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script type="text/javascript" src="../js/jszip.min.js"></script>
<script src="../js/centropais_functions.js"></script>
<script src="../js/centropais_basemap.js"></script>
<script src="../js/grijalva_charts.js"></script>
<script src="../js/Leaflet.Sync.js"></script>
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>-->
<script src="../js/jszip.min.js"></script>
<!-- load animation tweening lib requirement for CanvasFlowMapLayer -->
<script src="https://unpkg.com/@tweenjs/tween.js@18.5/dist/tween.umd.js"></script>
<script src="../js/CanvasFlowmapLayer.js"></script>
<!-- amcharts-->
<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>
<script>
$("#showFlows").on("click", () => {
let body = document.getElementsByTagName('body')[0];
let script1 = document.createElement('script');
let script2 = document.createElement('script');
let script3 = document.createElement('script');
script1.src = "../js/centropais_functions.js";
body.appendChild(script1);
script2.src = "../js/centropais_basemap.js";
body.appendChild(script2);
script3.src = "../js/centropais_charts.js";
body.appendChild(script3);
});
$("#showUrban").on("click", () => {
let body = document.getElementsByTagName('body')[0];
let script = document.createElement('script');
let script_piloto = document.createElement('script');
script.src = "../js/evolucion_urbana.js";
script_piloto.src = "../js/evolucion_urbana_charts.js";
body.appendChild(script);
body.appendChild(script_piloto);
});
</script>
</body>
......
......@@ -108,11 +108,7 @@ html {
-ms-transform: scale(0);
transform: scale(0);
font-weight: normal;
/*margin: 15px 0 0 0;
padding: 140px 60px 0px 60px;*/
margin: 10px;
padding: 0px 15px;
}
.hovereffect:hover a.info {
......@@ -138,7 +134,7 @@ html {
.hoverimg {
opacity: 0;
margin: -15px;
margin: -35px;
}
.hoverbtn {
......
/*!
* Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
*/@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-feed:before,.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before,.fa-gratipay:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper-pp:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-resistance:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\f1e3"}.fa-tty:before{content:"\f1e4"}.fa-binoculars:before{content:"\f1e5"}.fa-plug:before{content:"\f1e6"}.fa-slideshare:before{content:"\f1e7"}.fa-twitch:before{content:"\f1e8"}.fa-yelp:before{content:"\f1e9"}.fa-newspaper-o:before{content:"\f1ea"}.fa-wifi:before{content:"\f1eb"}.fa-calculator:before{content:"\f1ec"}.fa-paypal:before{content:"\f1ed"}.fa-google-wallet:before{content:"\f1ee"}.fa-cc-visa:before{content:"\f1f0"}.fa-cc-mastercard:before{content:"\f1f1"}.fa-cc-discover:before{content:"\f1f2"}.fa-cc-amex:before{content:"\f1f3"}.fa-cc-paypal:before{content:"\f1f4"}.fa-cc-stripe:before{content:"\f1f5"}.fa-bell-slash:before{content:"\f1f6"}.fa-bell-slash-o:before{content:"\f1f7"}.fa-trash:before{content:"\f1f8"}.fa-copyright:before{content:"\f1f9"}.fa-at:before{content:"\f1fa"}.fa-eyedropper:before{content:"\f1fb"}.fa-paint-brush:before{content:"\f1fc"}.fa-birthday-cake:before{content:"\f1fd"}.fa-area-chart:before{content:"\f1fe"}.fa-pie-chart:before{content:"\f200"}.fa-line-chart:before{content:"\f201"}.fa-lastfm:before{content:"\f202"}.fa-lastfm-square:before{content:"\f203"}.fa-toggle-off:before{content:"\f204"}.fa-toggle-on:before{content:"\f205"}.fa-bicycle:before{content:"\f206"}.fa-bus:before{content:"\f207"}.fa-ioxhost:before{content:"\f208"}.fa-angellist:before{content:"\f209"}.fa-cc:before{content:"\f20a"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\f20b"}.fa-meanpath:before{content:"\f20c"}.fa-buysellads:before{content:"\f20d"}.fa-connectdevelop:before{content:"\f20e"}.fa-dashcube:before{content:"\f210"}.fa-forumbee:before{content:"\f211"}.fa-leanpub:before{content:"\f212"}.fa-sellsy:before{content:"\f213"}.fa-shirtsinbulk:before{content:"\f214"}.fa-simplybuilt:before{content:"\f215"}.fa-skyatlas:before{content:"\f216"}.fa-cart-plus:before{content:"\f217"}.fa-cart-arrow-down:before{content:"\f218"}.fa-diamond:before{content:"\f219"}.fa-ship:before{content:"\f21a"}.fa-user-secret:before{content:"\f21b"}.fa-motorcycle:before{content:"\f21c"}.fa-street-view:before{content:"\f21d"}.fa-heartbeat:before{content:"\f21e"}.fa-venus:before{content:"\f221"}.fa-mars:before{content:"\f222"}.fa-mercury:before{content:"\f223"}.fa-intersex:before,.fa-transgender:before{content:"\f224"}.fa-transgender-alt:before{content:"\f225"}.fa-venus-double:before{content:"\f226"}.fa-mars-double:before{content:"\f227"}.fa-venus-mars:before{content:"\f228"}.fa-mars-stroke:before{content:"\f229"}.fa-mars-stroke-v:before{content:"\f22a"}.fa-mars-stroke-h:before{content:"\f22b"}.fa-neuter:before{content:"\f22c"}.fa-genderless:before{content:"\f22d"}.fa-facebook-official:before{content:"\f230"}.fa-pinterest-p:before{content:"\f231"}.fa-whatsapp:before{content:"\f232"}.fa-server:before{content:"\f233"}.fa-user-plus:before{content:"\f234"}.fa-user-times:before{content:"\f235"}.fa-hotel:before,.fa-bed:before{content:"\f236"}.fa-viacoin:before{content:"\f237"}.fa-train:before{content:"\f238"}.fa-subway:before{content:"\f239"}.fa-medium:before{content:"\f23a"}.fa-yc:before,.fa-y-combinator:before{content:"\f23b"}.fa-optin-monster:before{content:"\f23c"}.fa-opencart:before{content:"\f23d"}.fa-expeditedssl:before{content:"\f23e"}.fa-battery-4:before,.fa-battery:before,.fa-battery-full:before{content:"\f240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\f241"}.fa-battery-2:before,.fa-battery-half:before{content:"\f242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\f243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\f244"}.fa-mouse-pointer:before{content:"\f245"}.fa-i-cursor:before{content:"\f246"}.fa-object-group:before{content:"\f247"}.fa-object-ungroup:before{content:"\f248"}.fa-sticky-note:before{content:"\f249"}.fa-sticky-note-o:before{content:"\f24a"}.fa-cc-jcb:before{content:"\f24b"}.fa-cc-diners-club:before{content:"\f24c"}.fa-clone:before{content:"\f24d"}.fa-balance-scale:before{content:"\f24e"}.fa-hourglass-o:before{content:"\f250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\f251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\f253"}.fa-hourglass:before{content:"\f254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\f255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\f256"}.fa-hand-scissors-o:before{content:"\f257"}.fa-hand-lizard-o:before{content:"\f258"}.fa-hand-spock-o:before{content:"\f259"}.fa-hand-pointer-o:before{content:"\f25a"}.fa-hand-peace-o:before{content:"\f25b"}.fa-trademark:before{content:"\f25c"}.fa-registered:before{content:"\f25d"}.fa-creative-commons:before{content:"\f25e"}.fa-gg:before{content:"\f260"}.fa-gg-circle:before{content:"\f261"}.fa-tripadvisor:before{content:"\f262"}.fa-odnoklassniki:before{content:"\f263"}.fa-odnoklassniki-square:before{content:"\f264"}.fa-get-pocket:before{content:"\f265"}.fa-wikipedia-w:before{content:"\f266"}.fa-safari:before{content:"\f267"}.fa-chrome:before{content:"\f268"}.fa-firefox:before{content:"\f269"}.fa-opera:before{content:"\f26a"}.fa-internet-explorer:before{content:"\f26b"}.fa-tv:before,.fa-television:before{content:"\f26c"}.fa-contao:before{content:"\f26d"}.fa-500px:before{content:"\f26e"}.fa-amazon:before{content:"\f270"}.fa-calendar-plus-o:before{content:"\f271"}.fa-calendar-minus-o:before{content:"\f272"}.fa-calendar-times-o:before{content:"\f273"}.fa-calendar-check-o:before{content:"\f274"}.fa-industry:before{content:"\f275"}.fa-map-pin:before{content:"\f276"}.fa-map-signs:before{content:"\f277"}.fa-map-o:before{content:"\f278"}.fa-map:before{content:"\f279"}.fa-commenting:before{content:"\f27a"}.fa-commenting-o:before{content:"\f27b"}.fa-houzz:before{content:"\f27c"}.fa-vimeo:before{content:"\f27d"}.fa-black-tie:before{content:"\f27e"}.fa-fonticons:before{content:"\f280"}.fa-reddit-alien:before{content:"\f281"}.fa-edge:before{content:"\f282"}.fa-credit-card-alt:before{content:"\f283"}.fa-codiepie:before{content:"\f284"}.fa-modx:before{content:"\f285"}.fa-fort-awesome:before{content:"\f286"}.fa-usb:before{content:"\f287"}.fa-product-hunt:before{content:"\f288"}.fa-mixcloud:before{content:"\f289"}.fa-scribd:before{content:"\f28a"}.fa-pause-circle:before{content:"\f28b"}.fa-pause-circle-o:before{content:"\f28c"}.fa-stop-circle:before{content:"\f28d"}.fa-stop-circle-o:before{content:"\f28e"}.fa-shopping-bag:before{content:"\f290"}.fa-shopping-basket:before{content:"\f291"}.fa-hashtag:before{content:"\f292"}.fa-bluetooth:before{content:"\f293"}.fa-bluetooth-b:before{content:"\f294"}.fa-percent:before{content:"\f295"}.fa-gitlab:before{content:"\f296"}.fa-wpbeginner:before{content:"\f297"}.fa-wpforms:before{content:"\f298"}.fa-envira:before{content:"\f299"}.fa-universal-access:before{content:"\f29a"}.fa-wheelchair-alt:before{content:"\f29b"}.fa-question-circle-o:before{content:"\f29c"}.fa-blind:before{content:"\f29d"}.fa-audio-description:before{content:"\f29e"}.fa-volume-control-phone:before{content:"\f2a0"}.fa-braille:before{content:"\f2a1"}.fa-assistive-listening-systems:before{content:"\f2a2"}.fa-asl-interpreting:before,.fa-american-sign-language-interpreting:before{content:"\f2a3"}.fa-deafness:before,.fa-hard-of-hearing:before,.fa-deaf:before{content:"\f2a4"}.fa-glide:before{content:"\f2a5"}.fa-glide-g:before{content:"\f2a6"}.fa-signing:before,.fa-sign-language:before{content:"\f2a7"}.fa-low-vision:before{content:"\f2a8"}.fa-viadeo:before{content:"\f2a9"}.fa-viadeo-square:before{content:"\f2aa"}.fa-snapchat:before{content:"\f2ab"}.fa-snapchat-ghost:before{content:"\f2ac"}.fa-snapchat-square:before{content:"\f2ad"}.fa-pied-piper:before{content:"\f2ae"}.fa-first-order:before{content:"\f2b0"}.fa-yoast:before{content:"\f2b1"}.fa-themeisle:before{content:"\f2b2"}.fa-google-plus-circle:before,.fa-google-plus-official:before{content:"\f2b3"}.fa-fa:before,.fa-font-awesome:before{content:"\f2b4"}.fa-handshake-o:before{content:"\f2b5"}.fa-envelope-open:before{content:"\f2b6"}.fa-envelope-open-o:before{content:"\f2b7"}.fa-linode:before{content:"\f2b8"}.fa-address-book:before{content:"\f2b9"}.fa-address-book-o:before{content:"\f2ba"}.fa-vcard:before,.fa-address-card:before{content:"\f2bb"}.fa-vcard-o:before,.fa-address-card-o:before{content:"\f2bc"}.fa-user-circle:before{content:"\f2bd"}.fa-user-circle-o:before{content:"\f2be"}.fa-user-o:before{content:"\f2c0"}.fa-id-badge:before{content:"\f2c1"}.fa-drivers-license:before,.fa-id-card:before{content:"\f2c2"}.fa-drivers-license-o:before,.fa-id-card-o:before{content:"\f2c3"}.fa-quora:before{content:"\f2c4"}.fa-free-code-camp:before{content:"\f2c5"}.fa-telegram:before{content:"\f2c6"}.fa-thermometer-4:before,.fa-thermometer:before,.fa-thermometer-full:before{content:"\f2c7"}.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:"\f2c8"}.fa-thermometer-2:before,.fa-thermometer-half:before{content:"\f2c9"}.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:"\f2ca"}.fa-thermometer-0:before,.fa-thermometer-empty:before{content:"\f2cb"}.fa-shower:before{content:"\f2cc"}.fa-bathtub:before,.fa-s15:before,.fa-bath:before{content:"\f2cd"}.fa-podcast:before{content:"\f2ce"}.fa-window-maximize:before{content:"\f2d0"}.fa-window-minimize:before{content:"\f2d1"}.fa-window-restore:before{content:"\f2d2"}.fa-times-rectangle:before,.fa-window-close:before{content:"\f2d3"}.fa-times-rectangle-o:before,.fa-window-close-o:before{content:"\f2d4"}.fa-bandcamp:before{content:"\f2d5"}.fa-grav:before{content:"\f2d6"}.fa-etsy:before{content:"\f2d7"}.fa-imdb:before{content:"\f2d8"}.fa-ravelry:before{content:"\f2d9"}.fa-eercast:before{content:"\f2da"}.fa-microchip:before{content:"\f2db"}.fa-snowflake-o:before{content:"\f2dc"}.fa-superpowers:before{content:"\f2dd"}.fa-wpexplorer:before{content:"\f2de"}.fa-meetup:before{content:"\f2e0"}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}
.fa,
.fas,
.far,
.fal,
.fad,
.fab {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1; }
.fa-lg {
font-size: 1.33333em;
line-height: 0.75em;
vertical-align: -.0667em; }
.fa-xs {
font-size: .75em; }
.fa-sm {
font-size: .875em; }
.fa-1x {
font-size: 1em; }
.fa-2x {
font-size: 2em; }
.fa-3x {
font-size: 3em; }
.fa-4x {
font-size: 4em; }
.fa-5x {
font-size: 5em; }
.fa-6x {
font-size: 6em; }
.fa-7x {
font-size: 7em; }
.fa-8x {
font-size: 8em; }
.fa-9x {
font-size: 9em; }
.fa-10x {
font-size: 10em; }
.fa-fw {
text-align: center;
width: 1.25em; }
.fa-ul {
list-style-type: none;
margin-left: 2.5em;
padding-left: 0; }
.fa-ul > li {
position: relative; }
.fa-li {
left: -2em;
position: absolute;
text-align: center;
width: 2em;
line-height: inherit; }
.fa-border {
border: solid 0.08em #eee;
border-radius: .1em;
padding: .2em .25em .15em; }
.fa-pull-left {
float: left; }
.fa-pull-right {
float: right; }
.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
margin-right: .3em; }
.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
margin-left: .3em; }
.fa-spin {
-webkit-animation: fa-spin 2s infinite linear;
animation: fa-spin 2s infinite linear; }
.fa-pulse {
-webkit-animation: fa-spin 1s infinite steps(8);
animation: fa-spin 1s infinite steps(8); }
@-webkit-keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
.fa-rotate-90 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
-webkit-transform: rotate(90deg);
transform: rotate(90deg); }
.fa-rotate-180 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
-webkit-transform: rotate(180deg);
transform: rotate(180deg); }
.fa-rotate-270 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
-webkit-transform: rotate(270deg);
transform: rotate(270deg); }
.fa-flip-horizontal {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
-webkit-transform: scale(-1, 1);
transform: scale(-1, 1); }
.fa-flip-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
-webkit-transform: scale(1, -1);
transform: scale(1, -1); }
.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
-webkit-transform: scale(-1, -1);
transform: scale(-1, -1); }
:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-flip-both {
-webkit-filter: none;
filter: none; }
.fa-stack {
display: inline-block;
height: 2em;
line-height: 2em;
position: relative;
vertical-align: middle;
width: 2.5em; }
.fa-stack-1x,
.fa-stack-2x {
left: 0;
position: absolute;
text-align: center;
width: 100%; }
.fa-stack-1x {
line-height: inherit; }
.fa-stack-2x {
font-size: 2em; }
.fa-inverse {
color: #fff; }
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?7vj37q');
src: url('fonts/icomoon.eot?7vj37q#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?7vj37q') format('truetype'),
url('fonts/icomoon.woff?7vj37q') format('woff'),
url('fonts/icomoon.svg?7vj37q#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
.fa, .fas, .fab, .far {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa-plane1:before {
content: "\e903";
}
.fa-casetapeaje:before {
content: "\e904";
}
.fa-desechos:before {
content: "\e908";
}
.fa-escuela:before {
content: "\e909";
}
.fa-presa:before {
content: "\e90a";
}
.fa-puente:before {
content: "\e90b";
}
.fa-puertoindustrial:before {
content: "\e90c";
}
.fa-puntofronterizo:before {
content: "\e90d";
}
.fa-spinner1:before {
content: "\e97a";
}
.fa-spinner2:before {
content: "\e97b";
}
.fa-spinner3:before {
content: "\e97c";
}
.fa-spinner4:before {
content: "\e97d";
}
.fa-spinner5:before {
content: "\e97e";
}
.fa-spinner6:before {
content: "\e97f";
}
.fa-spinner7:before {
content: "\e980";
}
.fa-spinner8:before {
content: "\e981";
}
.fa-spinner9:before {
content: "\e982";
}
.fa-spinner10:before {
content: "\e983";
}
.fa-shopping-cart1:before {
content: "\f08f";
}
.fa-dollar:before {
content: "\f178";
}
.fa-bus1:before {
content: "\f2e8";
}
.fa-bed1:before {
content: "\f2e9";
}
.fa-dollar-sign:before {
content: "\f159";
}
.fa-file-invoice-dollar:before {
content: "\f573";
}
.fa-comment-dollar:before {
content: "\f651";
}
.fa-comments-dollar:before {
content: "\f653";
}
.fa-funnel-dollar:before {
content: "\f662";
}
.fa-search-dollar:before {
content: "\f688";
}
.fa-firefox-browser:before {
content: "\e007";
}
.fa-ideal:before {
content: "\e013";
}
.fa-microblog:before {
content: "\e01a";
}
.fa-pied-piper-square:before {
content: "\e01e";
}
.fa-unity:before {
content: "\e049";
}
.fa-dailymotion:before {
content: "\e052";
}
.fa-instagram-square:before {
content: "\e055";
}
.fa-mixer:before {
content: "\e056";
}
.fa-shopify:before {
content: "\e057";
}
.fa-deezer:before {
content: "\e077";
}
.fa-edge-legacy:before {
content: "\e078";
}
.fa-google-pay:before {
content: "\e079";
}
.fa-rust:before {
content: "\e07a";
}
.fa-tiktok:before {
content: "\e07b";
}
.fa-unsplash:before {
content: "\e07c";
}
.fa-twitter-square:before {
content: "\f081";
}
.fa-facebook-square:before {
content: "\f082";
}
.fa-linkedin:before {
content: "\f08c";
}
.fa-github-square:before {
content: "\f092";
}
.fa-twitter:before {
content: "\f099";
}
.fa-facebook:before {
content: "\f09a";
}
.fa-github:before {
content: "\f09b";
}
.fa-pinterest:before {
content: "\f0d2";
}
.fa-pinterest-square:before {
content: "\f0d3";
}
.fa-google-plus-square:before {
content: "\f0d4";
}
.fa-google-plus-g:before {
content: "\f0d5";
}
.fa-linkedin-in:before {
content: "\f0e1";
}
.fa-github-alt:before {
content: "\f113";
}
.fa-maxcdn:before {
content: "\f136";
}
.fa-html5:before {
content: "\f13b";
}
.fa-css3:before {
content: "\f13c";
}
.fa-btc:before {
content: "\f15a";
}
.fa-youtube:before {
content: "\f167";
}
.fa-xing:before {
content: "\f168";
}
.fa-xing-square:before {
content: "\f169";
}
.fa-dropbox:before {
content: "\f16b";
}
.fa-stack-overflow:before {
content: "\f16c";
}
.fa-instagram:before {
content: "\f16d";
}
.fa-flickr:before {
content: "\f16e";
}
.fa-adn:before {
content: "\f170";
}
.fa-bitbucket:before {
content: "\f171";
}
.fa-tumblr:before {
content: "\f173";
}
.fa-tumblr-square:before {
content: "\f174";
}
.fa-apple:before {
content: "\f179";
}
.fa-windows:before {
content: "\f17a";
}
.fa-android:before {
content: "\f17b";
}
.fa-linux:before {
content: "\f17c";
}
.fa-dribbble:before {
content: "\f17d";
}
.fa-skype:before {
content: "\f17e";
}
.fa-foursquare:before {
content: "\f180";
}
.fa-trello:before {
content: "\f181";
}
.fa-gratipay:before {
content: "\f184";
}
.fa-vk:before {
content: "\f189";
}
.fa-weibo:before {
content: "\f18a";
}
.fa-renren:before {
content: "\f18b";
}
.fa-pagelines:before {
content: "\f18c";
}
.fa-stack-exchange:before {
content: "\f18d";
}
.fa-vimeo-square:before {
content: "\f194";
}
.fa-slack:before {
content: "\f198";
}
.fa-wordpress:before {
content: "\f19a";
}
.fa-openid:before {
content: "\f19b";
}
.fa-yahoo:before {
content: "\f19e";
}
.fa-google:before {
content: "\f1a0";
}
.fa-reddit:before {
content: "\f1a1";
}
.fa-reddit-square:before {
content: "\f1a2";
}
.fa-stumbleupon-circle:before {
content: "\f1a3";
}
.fa-stumbleupon:before {
content: "\f1a4";
}
.fa-delicious:before {
content: "\f1a5";
}
.fa-digg:before {
content: "\f1a6";
}
.fa-pied-piper-pp:before {
content: "\f1a7";
}
.fa-pied-piper-alt:before {
content: "\f1a8";
}
.fa-drupal:before {
content: "\f1a9";
}
.fa-joomla:before {
content: "\f1aa";
}
.fa-behance:before {
content: "\f1b4";
}
.fa-behance-square:before {
content: "\f1b5";
}
.fa-steam:before {
content: "\f1b6";
}
.fa-steam-square:before {
content: "\f1b7";
}
.fa-spotify:before {
content: "\f1bc";
}
.fa-deviantart:before {
content: "\f1bd";
}
.fa-soundcloud:before {
content: "\f1be";
}
.fa-vine:before {
content: "\f1ca";
}
.fa-codepen:before {
content: "\f1cb";
}
.fa-jsfiddle:before {
content: "\f1cc";
}
.fa-rebel:before {
content: "\f1d0";
}
.fa-empire:before {
content: "\f1d1";
}
.fa-git-square:before {
content: "\f1d2";
}
.fa-git:before {
content: "\f1d3";
}
.fa-hacker-news:before {
content: "\f1d4";
}
.fa-tencent-weibo:before {
content: "\f1d5";
}
.fa-qq:before {
content: "\f1d6";
}
.fa-weixin:before {
content: "\f1d7";
}
.fa-slideshare:before {
content: "\f1e7";
}
.fa-twitch:before {
content: "\f1e8";
}
.fa-yelp:before {
content: "\f1e9";
}
.fa-paypal:before {
content: "\f1ed";
}
.fa-google-wallet:before {
content: "\f1ee";
}
.fa-cc-visa:before {
content: "\f1f0";
}
.fa-cc-mastercard:before {
content: "\f1f1";
}
.fa-cc-discover:before {
content: "\f1f2";
}
.fa-cc-amex:before {
content: "\f1f3";
}
.fa-cc-paypal:before {
content: "\f1f4";
}
.fa-cc-stripe:before {
content: "\f1f5";
}
.fa-lastfm:before {
content: "\f202";
}
.fa-lastfm-square:before {
content: "\f203";
}
.fa-ioxhost:before {
content: "\f208";
}
.fa-angellist:before {
content: "\f209";
}
.fa-buysellads:before {
content: "\f20d";
}
.fa-connectdevelop:before {
content: "\f20e";
}
.fa-dashcube:before {
content: "\f210";
}
.fa-forumbee:before {
content: "\f211";
}
.fa-leanpub:before {
content: "\f212";
}
.fa-sellsy:before {
content: "\f213";
}
.fa-shirtsinbulk:before {
content: "\f214";
}
.fa-simplybuilt:before {
content: "\f215";
}
.fa-skyatlas:before {
content: "\f216";
}
.fa-pinterest-p:before {
content: "\f231";
}
.fa-whatsapp:before {
content: "\f232";
}
.fa-viacoin:before {
content: "\f237";
}
.fa-medium:before {
content: "\f23a";
}
.fa-y-combinator:before {
content: "\f23b";
}
.fa-optin-monster:before {
content: "\f23c";
}
.fa-opencart:before {
content: "\f23d";
}
.fa-expeditedssl:before {
content: "\f23e";
}
.fa-cc-jcb:before {
content: "\f24b";
}
.fa-cc-diners-club:before {
content: "\f24c";
}
.fa-creative-commons:before {
content: "\f25e";
}
.fa-gg:before {
content: "\f260";
}
.fa-gg-circle:before {
content: "\f261";
}
.fa-tripadvisor:before {
content: "\f262";
}
.fa-odnoklassniki:before {
content: "\f263";
}
.fa-odnoklassniki-square:before {
content: "\f264";
}
.fa-get-pocket:before {
content: "\f265";
}
.fa-wikipedia-w:before {
content: "\f266";
}
.fa-safari:before {
content: "\f267";
}
.fa-chrome:before {
content: "\f268";
}
.fa-firefox:before {
content: "\f269";
}
.fa-opera:before {
content: "\f26a";
}
.fa-internet-explorer:before {
content: "\f26b";
}
.fa-contao:before {
content: "\f26d";
}
.fa-500px:before {
content: "\f26e";
}
.fa-amazon:before {
content: "\f270";
}
.fa-houzz:before {
content: "\f27c";
}
.fa-vimeo-v:before {
content: "\f27d";
}
.fa-black-tie:before {
content: "\f27e";
}
.fa-fonticons:before {
content: "\f280";
}
.fa-reddit-alien:before {
content: "\f281";
}
.fa-edge:before {
content: "\f282";
}
.fa-codiepie:before {
content: "\f284";
}
.fa-modx:before {
content: "\f285";
}
.fa-fort-awesome:before {
content: "\f286";
}
.fa-usb:before {
content: "\f287";
}
.fa-product-hunt:before {
content: "\f288";
}
.fa-mixcloud:before {
content: "\f289";
}
.fa-scribd:before {
content: "\f28a";
}
.fa-bluetooth:before {
content: "\f293";
}
.fa-bluetooth-b:before {
content: "\f294";
}
.fa-gitlab:before {
content: "\f296";
}
.fa-wpbeginner:before {
content: "\f297";
}
.fa-wpforms:before {
content: "\f298";
}
.fa-envira:before {
content: "\f299";
}
.fa-glide:before {
content: "\f2a5";
}
.fa-glide-g:before {
content: "\f2a6";
}
.fa-viadeo:before {
content: "\f2a9";
}
.fa-viadeo-square:before {
content: "\f2aa";
}
.fa-snapchat:before {
content: "\f2ab";
}
.fa-snapchat-ghost:before {
content: "\f2ac";
}
.fa-snapchat-square:before {
content: "\f2ad";
}
.fa-pied-piper:before {
content: "\f2ae";
}
.fa-first-order:before {
content: "\f2b0";
}
.fa-yoast:before {
content: "\f2b1";
}
.fa-themeisle:before {
content: "\f2b2";
}
.fa-google-plus:before {
content: "\f2b3";
}
.fa-font-awesome:before {
content: "\f2b4";
}
.fa-linode:before {
content: "\f2b8";
}
.fa-quora:before {
content: "\f2c4";
}
.fa-free-code-camp:before {
content: "\f2c5";
}
.fa-telegram:before {
content: "\f2c6";
}
.fa-bandcamp:before {
content: "\f2d5";
}
.fa-grav:before {
content: "\f2d6";
}
.fa-etsy:before {
content: "\f2d7";
}
.fa-imdb:before {
content: "\f2d8";
}
.fa-ravelry:before {
content: "\f2d9";
}
.fa-sellcast:before {
content: "\f2da";
}
.fa-superpowers:before {
content: "\f2dd";
}
.fa-wpexplorer:before {
content: "\f2de";
}
.fa-meetup:before {
content: "\f2e0";
}
.fa-font-awesome-alt:before {
content: "\f35c";
}
.fa-accessible-icon:before {
content: "\f368";
}
.fa-accusoft:before {
content: "\f369";
}
.fa-adversal:before {
content: "\f36a";
}
.fa-affiliatetheme:before {
content: "\f36b";
}
.fa-algolia:before {
content: "\f36c";
}
.fa-amilia:before {
content: "\f36d";
}
.fa-angrycreative:before {
content: "\f36e";
}
.fa-app-store:before {
content: "\f36f";
}
.fa-app-store-ios:before {
content: "\f370";
}
.fa-apper:before {
content: "\f371";
}
.fa-asymmetrik:before {
content: "\f372";
}
.fa-audible:before {
content: "\f373";
}
.fa-avianex:before {
content: "\f374";
}
.fa-aws:before {
content: "\f375";
}
.fa-bimobject:before {
content: "\f378";
}
.fa-bitcoin:before {
content: "\f379";
}
.fa-bity:before {
content: "\f37a";
}
.fa-blackberry:before {
content: "\f37b";
}
.fa-blogger:before {
content: "\f37c";
}
.fa-blogger-b:before {
content: "\f37d";
}
.fa-buromobelexperte:before {
content: "\f37f";
}
.fa-centercode:before {
content: "\f380";
}
.fa-cloudscale:before {
content: "\f383";
}
.fa-cloudsmith:before {
content: "\f384";
}
.fa-cloudversify:before {
content: "\f385";
}
.fa-cpanel:before {
content: "\f388";
}
.fa-css3-alt:before {
content: "\f38b";
}
.fa-cuttlefish:before {
content: "\f38c";
}
.fa-d-and-d:before {
content: "\f38d";
}
.fa-deploydog:before {
content: "\f38e";
}
.fa-deskpro:before {
content: "\f38f";
}
.fa-digital-ocean:before {
content: "\f391";
}
.fa-discord:before {
content: "\f392";
}
.fa-discourse:before {
content: "\f393";
}
.fa-dochub:before {
content: "\f394";
}
.fa-docker:before {
content: "\f395";
}
.fa-draft2digital:before {
content: "\f396";
}
.fa-dribbble-square:before {
content: "\f397";
}
.fa-dyalog:before {
content: "\f399";
}
.fa-earlybirds:before {
content: "\f39a";
}
.fa-erlang:before {
content: "\f39d";
}
.fa-facebook-f:before {
content: "\f39e";
}
.fa-facebook-messenger:before {
content: "\f39f";
}
.fa-firstdraft:before {
content: "\f3a1";
}
.fa-fonticons-fi:before {
content: "\f3a2";
}
.fa-fort-awesome-alt:before {
content: "\f3a3";
}
.fa-freebsd:before {
content: "\f3a4";
}
.fa-gitkraken:before {
content: "\f3a6";
}
.fa-gofore:before {
content: "\f3a7";
}
.fa-goodreads:before {
content: "\f3a8";
}
.fa-goodreads-g:before {
content: "\f3a9";
}
.fa-google-drive:before {
content: "\f3aa";
}
.fa-google-play:before {
content: "\f3ab";
}
.fa-gripfire:before {
content: "\f3ac";
}
.fa-grunt:before {
content: "\f3ad";
}
.fa-gulp:before {
content: "\f3ae";
}
.fa-hacker-news-square:before {
content: "\f3af";
}
.fa-hire-a-helper:before {
content: "\f3b0";
}
.fa-hotjar:before {
content: "\f3b1";
}
.fa-hubspot:before {
content: "\f3b2";
}
.fa-itunes:before {
content: "\f3b4";
}
.fa-itunes-note:before {
content: "\f3b5";
}
.fa-jenkins:before {
content: "\f3b6";
}
.fa-joget:before {
content: "\f3b7";
}
.fa-js:before {
content: "\f3b8";
}
.fa-js-square:before {
content: "\f3b9";
}
.fa-keycdn:before {
content: "\f3ba";
}
.fa-kickstarter:before {
content: "\f3bb";
}
.fa-kickstarter-k:before {
content: "\f3bc";
}
.fa-laravel:before {
content: "\f3bd";
}
.fa-line:before {
content: "\f3c0";
}
.fa-lyft:before {
content: "\f3c3";
}
.fa-magento:before {
content: "\f3c4";
}
.fa-medapps:before {
content: "\f3c6";
}
.fa-medium-m:before {
content: "\f3c7";
}
.fa-medrt:before {
content: "\f3c8";
}
.fa-microsoft:before {
content: "\f3ca";
}
.fa-mix:before {
content: "\f3cb";
}
.fa-mizuni:before {
content: "\f3cc";
}
.fa-monero:before {
content: "\f3d0";
}
.fa-napster:before {
content: "\f3d2";
}
.fa-node-js:before {
content: "\f3d3";
}
.fa-npm:before {
content: "\f3d4";
}
.fa-ns8:before {
content: "\f3d5";
}
.fa-nutritionix:before {
content: "\f3d6";
}
.fa-page4:before {
content: "\f3d7";
}
.fa-palfed:before {
content: "\f3d8";
}
.fa-patreon:before {
content: "\f3d9";
}
.fa-periscope:before {
content: "\f3da";
}
.fa-phabricator:before {
content: "\f3db";
}
.fa-phoenix-framework:before {
content: "\f3dc";
}
.fa-playstation:before {
content: "\f3df";
}
.fa-pushed:before {
content: "\f3e1";
}
.fa-python:before {
content: "\f3e2";
}
.fa-red-river:before {
content: "\f3e3";
}
.fa-wpressr:before {
content: "\f3e4";
}
.fa-replyd:before {
content: "\f3e6";
}
.fa-resolving:before {
content: "\f3e7";
}
.fa-rocketchat:before {
content: "\f3e8";
}
.fa-rockrms:before {
content: "\f3e9";
}
.fa-schlix:before {
content: "\f3ea";
}
.fa-searchengin:before {
content: "\f3eb";
}
.fa-servicestack:before {
content: "\f3ec";
}
.fa-sistrix:before {
content: "\f3ee";
}
.fa-slack-hash:before {
content: "\f3ef";
}
.fa-speakap:before {
content: "\f3f3";
}
.fa-staylinked:before {
content: "\f3f5";
}
.fa-steam-symbol:before {
content: "\f3f6";
}
.fa-sticker-mule:before {
content: "\f3f7";
}
.fa-studiovinari:before {
content: "\f3f8";
}
.fa-supple:before {
content: "\f3f9";
}
.fa-telegram-plane:before {
content: "\f3fe";
}
.fa-uber:before {
content: "\f402";
}
.fa-uikit:before {
content: "\f403";
}
.fa-uniregistry:before {
content: "\f404";
}
.fa-untappd:before {
content: "\f405";
}
.fa-ussunnah:before {
content: "\f407";
}
.fa-vaadin:before {
content: "\f408";
}
.fa-viber:before {
content: "\f409";
}
.fa-vimeo:before {
content: "\f40a";
}
.fa-vnv:before {
content: "\f40b";
}
.fa-whatsapp-square:before {
content: "\f40c";
}
.fa-whmcs:before {
content: "\f40d";
}
.fa-wordpress-simple:before {
content: "\f411";
}
.fa-xbox:before {
content: "\f412";
}
.fa-yandex:before {
content: "\f413";
}
.fa-yandex-international:before {
content: "\f414";
}
.fa-apple-pay:before {
content: "\f415";
}
.fa-cc-apple-pay:before {
content: "\f416";
}
.fa-fly:before {
content: "\f417";
}
.fa-node:before {
content: "\f419";
}
.fa-osi:before {
content: "\f41a";
}
.fa-react:before {
content: "\f41b";
}
.fa-autoprefixer:before {
content: "\f41c";
}
.fa-less:before {
content: "\f41d";
}
.fa-sass:before {
content: "\f41e";
}
.fa-vuejs:before {
content: "\f41f";
}
.fa-angular:before {
content: "\f420";
}
.fa-aviato:before {
content: "\f421";
}
.fa-ember:before {
content: "\f423";
}
.fa-font-awesome-flag:before {
content: "\f425";
}
.fa-gitter:before {
content: "\f426";
}
.fa-hooli:before {
content: "\f427";
}
.fa-strava:before {
content: "\f428";
}
.fa-stripe:before {
content: "\f429";
}
.fa-stripe-s:before {
content: "\f42a";
}
.fa-typo3:before {
content: "\f42b";
}
.fa-amazon-pay:before {
content: "\f42c";
}
.fa-cc-amazon-pay:before {
content: "\f42d";
}
.fa-ethereum:before {
content: "\f42e";
}
.fa-korvue:before {
content: "\f42f";
}
.fa-elementor:before {
content: "\f430";
}
.fa-youtube-square:before {
content: "\f431";
}
.fa-flipboard:before {
content: "\f44d";
}
.fa-hips:before {
content: "\f452";
}
.fa-php:before {
content: "\f457";
}
.fa-quinscape:before {
content: "\f459";
}
.fa-readme:before {
content: "\f4d5";
}
.fa-java:before {
content: "\f4e4";
}
.fa-pied-piper-hat:before {
content: "\f4e5";
}
.fa-creative-commons-by:before {
content: "\f4e7";
}
.fa-creative-commons-nc:before {
content: "\f4e8";
}
.fa-creative-commons-nc-eu:before {
content: "\f4e9";
}
.fa-creative-commons-nc-jp:before {
content: "\f4ea";
}
.fa-creative-commons-nd:before {
content: "\f4eb";
}
.fa-creative-commons-pd:before {
content: "\f4ec";
}
.fa-creative-commons-pd-alt:before {
content: "\f4ed";
}
.fa-creative-commons-remix:before {
content: "\f4ee";
}
.fa-creative-commons-sa:before {
content: "\f4ef";
}
.fa-creative-commons-sampling:before {
content: "\f4f0";
}
.fa-creative-commons-sampling-plus:before {
content: "\f4f1";
}
.fa-creative-commons-share:before {
content: "\f4f2";
}
.fa-creative-commons-zero:before {
content: "\f4f3";
}
.fa-ebay:before {
content: "\f4f4";
}
.fa-keybase:before {
content: "\f4f5";
}
.fa-mastodon:before {
content: "\f4f6";
}
.fa-r-project:before {
content: "\f4f7";
}
.fa-researchgate:before {
content: "\f4f8";
}
.fa-teamspeak:before {
content: "\f4f9";
}
.fa-first-order-alt:before {
content: "\f50a";
}
.fa-fulcrum:before {
content: "\f50b";
}
.fa-galactic-republic:before {
content: "\f50c";
}
.fa-galactic-senate:before {
content: "\f50d";
}
.fa-jedi-order:before {
content: "\f50e";
}
.fa-mandalorian:before {
content: "\f50f";
}
.fa-old-republic:before {
content: "\f510";
}
.fa-phoenix-squadron:before {
content: "\f511";
}
.fa-sith:before {
content: "\f512";
}
.fa-trade-federation:before {
content: "\f513";
}
.fa-wolf-pack-battalion:before {
content: "\f514";
}
.fa-hornbill:before {
content: "\f592";
}
.fa-mailchimp:before {
content: "\f59e";
}
.fa-megaport:before {
content: "\f5a3";
}
.fa-nimblr:before {
content: "\f5a8";
}
.fa-rev:before {
content: "\f5b2";
}
.fa-shopware:before {
content: "\f5b5";
}
.fa-squarespace:before {
content: "\f5be";
}
.fa-themeco:before {
content: "\f5c6";
}
.fa-weebly:before {
content: "\f5cc";
}
.fa-wix:before {
content: "\f5cf";
}
.fa-ello:before {
content: "\f5f1";
}
.fa-hackerrank:before {
content: "\f5f7";
}
.fa-kaggle:before {
content: "\f5fa";
}
.fa-markdown:before {
content: "\f60f";
}
.fa-neos:before {
content: "\f612";
}
.fa-zhihu:before {
content: "\f63f";
}
.fa-alipay:before {
content: "\f642";
}
.fa-the-red-yeti:before {
content: "\f69d";
}
.fa-acquisitions-incorporated:before {
content: "\f6af";
}
.fa-critical-role:before {
content: "\f6c9";
}
.fa-d-and-d-beyond:before {
content: "\f6ca";
}
.fa-dev:before {
content: "\f6cc";
}
.fa-fantasy-flight-games:before {
content: "\f6dc";
}
.fa-penny-arcade:before {
content: "\f704";
}
.fa-wizards-of-the-coast:before {
content: "\f730";
}
.fa-think-peaks:before {
content: "\f731";
}
.fa-reacteurope:before {
content: "\f75d";
}
.fa-adobe:before {
content: "\f778";
}
.fa-artstation:before {
content: "\f77a";
}
.fa-atlassian:before {
content: "\f77b";
}
.fa-canadian-maple-leaf:before {
content: "\f785";
}
.fa-centos:before {
content: "\f789";
}
.fa-confluence:before {
content: "\f78d";
}
.fa-dhl:before {
content: "\f790";
}
.fa-diaspora:before {
content: "\f791";
}
.fa-fedex:before {
content: "\f797";
}
.fa-fedora:before {
content: "\f798";
}
.fa-figma:before {
content: "\f799";
}
.fa-intercom:before {
content: "\f7af";
}
.fa-invision:before {
content: "\f7b0";
}
.fa-jira:before {
content: "\f7b1";
}
.fa-mendeley:before {
content: "\f7b3";
}
.fa-raspberry-pi:before {
content: "\f7bb";
}
.fa-redhat:before {
content: "\f7bc";
}
.fa-sketch:before {
content: "\f7c6";
}
.fa-sourcetree:before {
content: "\f7d3";
}
.fa-suse:before {
content: "\f7d6";
}
.fa-ubuntu:before {
content: "\f7df";
}
.fa-ups:before {
content: "\f7e0";
}
.fa-usps:before {
content: "\f7e1";
}
.fa-yarn:before {
content: "\f7e3";
}
.fa-airbnb:before {
content: "\f834";
}
.fa-battle-net:before {
content: "\f835";
}
.fa-bootstrap:before {
content: "\f836";
}
.fa-buffer:before {
content: "\f837";
}
.fa-chromecast:before {
content: "\f838";
}
.fa-evernote:before {
content: "\f839";
}
.fa-itch-io:before {
content: "\f83a";
}
.fa-salesforce:before {
content: "\f83b";
}
.fa-speaker-deck:before {
content: "\f83c";
}
.fa-symfony:before {
content: "\f83d";
}
.fa-waze:before {
content: "\f83f";
}
.fa-yammer:before {
content: "\f840";
}
.fa-git-alt:before {
content: "\f841";
}
.fa-stackpath:before {
content: "\f842";
}
.fa-cotton-bureau:before {
content: "\f89e";
}
.fa-buy-n-large:before {
content: "\f8a6";
}
.fa-mdb:before {
content: "\f8ca";
}
.fa-orcid:before {
content: "\f8d2";
}
.fa-swift:before {
content: "\f8e1";
}
.fa-umbraco:before {
content: "\f8e8";
}
.fa-heart:before {
content: "\f004";
}
.fa-star:before {
content: "\f005";
}
.fa-user:before {
content: "\f007";
}
.fa-clock:before {
content: "\f017";
}
.fa-list-alt:before {
content: "\f022";
}
.fa-flag:before {
content: "\f024";
}
.fa-bookmark:before {
content: "\f02e";
}
.fa-image:before {
content: "\f03e";
}
.fa-edit:before {
content: "\f044";
}
.fa-times-circle:before {
content: "\f057";
}
.fa-check-circle:before {
content: "\f058";
}
.fa-question-circle:before {
content: "\f059";
}
.fa-eye:before {
content: "\f06e";
}
.fa-eye-slash:before {
content: "\f070";
}
.fa-calendar-alt:before {
content: "\f073";
}
.fa-comment:before {
content: "\f075";
}
.fa-folder:before {
content: "\f07b";
}
.fa-folder-open:before {
content: "\f07c";
}
.fa-chart-bar:before {
content: "\f080";
}
.fa-comments:before {
content: "\f086";
}
.fa-star-half:before {
content: "\f089";
}
.fa-lemon:before {
content: "\f094";
}
.fa-credit-card:before {
content: "\f09d";
}
.fa-hdd:before {
content: "\f0a0";
}
.fa-hand-point-right:before {
content: "\f0a4";
}
.fa-hand-point-left:before {
content: "\f0a5";
}
.fa-hand-point-up:before {
content: "\f0a6";
}
.fa-hand-point-down:before {
content: "\f0a7";
}
.fa-copy:before {
content: "\f0c5";
}
.fa-save:before {
content: "\f0c7";
}
.fa-square:before {
content: "\f0c8";
}
.fa-envelope:before {
content: "\f0e0";
}
.fa-lightbulb:before {
content: "\f0eb";
}
.fa-bell:before {
content: "\f0f3";
}
.fa-hospital:before {
content: "\f0f8";
}
.fa-plus-square:before {
content: "\f0fe";
}
.fa-circle:before {
content: "\f111";
}
.fa-smile:before {
content: "\f118";
}
.fa-frown:before {
content: "\f119";
}
.fa-meh:before {
content: "\f11a";
}
.fa-keyboard:before {
content: "\f11c";
}
.fa-calendar:before {
content: "\f133";
}
.fa-play-circle:before {
content: "\f144";
}
.fa-minus-square:before {
content: "\f146";
}
.fa-check-square:before {
content: "\f14a";
}
.fa-share-square:before {
content: "\f14d";
}
.fa-compass:before {
content: "\f14e";
}
.fa-caret-square-down:before {
content: "\f150";
}
.fa-caret-square-up:before {
content: "\f151";
}
.fa-caret-square-right:before {
content: "\f152";
}
.fa-file:before {
content: "\f15b";
}
.fa-file-alt:before {
content: "\f15c";
}
.fa-thumbs-up:before {
content: "\f164";
}
.fa-thumbs-down:before {
content: "\f165";
}
.fa-sun:before {
content: "\f185";
}
.fa-moon:before {
content: "\f186";
}
.fa-caret-square-left:before {
content: "\f191";
}
.fa-dot-circle:before {
content: "\f192";
}
.fa-building:before {
content: "\f1ad";
}
.fa-file-pdf:before {
content: "\f1c1";
}
.fa-file-word:before {
content: "\f1c2";
}
.fa-file-excel:before {
content: "\f1c3";
}
.fa-file-powerpoint:before {
content: "\f1c4";
}
.fa-file-image:before {
content: "\f1c5";
}
.fa-file-archive:before {
content: "\f1c6";
}
.fa-file-audio:before {
content: "\f1c7";
}
.fa-file-video:before {
content: "\f1c8";
}
.fa-file-code:before {
content: "\f1c9";
}
.fa-life-ring:before {
content: "\f1cd";
}
.fa-paper-plane:before {
content: "\f1d8";
}
.fa-futbol:before {
content: "\f1e3";
}
.fa-newspaper:before {
content: "\f1ea";
}
.fa-bell-slash:before {
content: "\f1f6";
}
.fa-copyright:before {
content: "\f1f9";
}
.fa-closed-captioning:before {
content: "\f20a";
}
.fa-object-group:before {
content: "\f247";
}
.fa-object-ungroup:before {
content: "\f248";
}
.fa-sticky-note:before {
content: "\f249";
}
.fa-clone:before {
content: "\f24d";
}
.fa-hourglass:before {
content: "\f254";
}
.fa-hand-rock:before {
content: "\f255";
}
.fa-hand-paper:before {
content: "\f256";
}
.fa-hand-scissors:before {
content: "\f257";
}
.fa-hand-lizard:before {
content: "\f258";
}
.fa-hand-spock:before {
content: "\f259";
}
.fa-hand-pointer:before {
content: "\f25a";
}
.fa-hand-peace:before {
content: "\f25b";
}
.fa-registered:before {
content: "\f25d";
}
.fa-calendar-plus:before {
content: "\f271";
}
.fa-calendar-minus:before {
content: "\f272";
}
.fa-calendar-times:before {
content: "\f273";
}
.fa-calendar-check:before {
content: "\f274";
}
.fa-map:before {
content: "\f279";
}
.fa-comment-alt:before {
content: "\f27a";
}
.fa-pause-circle:before {
content: "\f28b";
}
.fa-stop-circle:before {
content: "\f28d";
}
.fa-handshake:before {
content: "\f2b5";
}
.fa-envelope-open:before {
content: "\f2b6";
}
.fa-address-book:before {
content: "\f2b9";
}
.fa-address-card:before {
content: "\f2bb";
}
.fa-user-circle:before {
content: "\f2bd";
}
.fa-id-badge:before {
content: "\f2c1";
}
.fa-id-card:before {
content: "\f2c2";
}
.fa-window-maximize:before {
content: "\f2d0";
}
.fa-window-minimize:before {
content: "\f2d1";
}
.fa-window-restore:before {
content: "\f2d2";
}
.fa-snowflake:before {
content: "\f2dc";
}
.fa-trash-alt:before {
content: "\f2ed";
}
.fa-images:before {
content: "\f302";
}
.fa-clipboard:before {
content: "\f328";
}
.fa-arrow-alt-circle-down:before {
content: "\f358";
}
.fa-arrow-alt-circle-left:before {
content: "\f359";
}
.fa-arrow-alt-circle-right:before {
content: "\f35a";
}
.fa-arrow-alt-circle-up:before {
content: "\f35b";
}
.fa-gem:before {
content: "\f3a5";
}
.fa-money-bill-alt:before {
content: "\f3d1";
}
.fa-window-close:before {
content: "\f410";
}
.fa-comment-dots:before {
content: "\f4ad";
}
.fa-smile-wink:before {
content: "\f4da";
}
.fa-angry:before {
content: "\f556";
}
.fa-dizzy:before {
content: "\f567";
}
.fa-flushed:before {
content: "\f579";
}
.fa-frown-open:before {
content: "\f57a";
}
.fa-grimace:before {
content: "\f57f";
}
.fa-grin:before {
content: "\f580";
}
.fa-grin-alt:before {
content: "\f581";
}
.fa-grin-beam:before {
content: "\f582";
}
.fa-grin-beam-sweat:before {
content: "\f583";
}
.fa-grin-hearts:before {
content: "\f584";
}
.fa-grin-squint:before {
content: "\f585";
}
.fa-grin-squint-tears:before {
content: "\f586";
}
.fa-grin-stars:before {
content: "\f587";
}
.fa-grin-tears:before {
content: "\f588";
}
.fa-grin-tongue:before {
content: "\f589";
}
.fa-grin-tongue-squint:before {
content: "\f58a";
}
.fa-grin-tongue-wink:before {
content: "\f58b";
}
.fa-grin-wink:before {
content: "\f58c";
}
.fa-kiss:before {
content: "\f596";
}
.fa-kiss-beam:before {
content: "\f597";
}
.fa-kiss-wink-heart:before {
content: "\f598";
}
.fa-laugh:before {
content: "\f599";
}
.fa-laugh-beam:before {
content: "\f59a";
}
.fa-laugh-squint:before {
content: "\f59b";
}
.fa-laugh-wink:before {
content: "\f59c";
}
.fa-meh-blank:before {
content: "\f5a4";
}
.fa-meh-rolling-eyes:before {
content: "\f5a5";
}
.fa-sad-cry:before {
content: "\f5b3";
}
.fa-sad-tear:before {
content: "\f5b4";
}
.fa-smile-beam:before {
content: "\f5b8";
}
.fa-surprise:before {
content: "\f5c2";
}
.fa-tired:before {
content: "\f5c8";
}
.fa-faucet:before {
content: "\e005";
}
.fa-trailer:before {
content: "\e041";
}
.fa-bacteria:before {
content: "\e059";
}
.fa-bacterium:before {
content: "\e05a";
}
.fa-box-tissue:before {
content: "\e05b";
}
.fa-hand-holding-medical:before {
content: "\e05c";
}
.fa-hand-sparkles:before {
content: "\e05d";
}
.fa-hands-wash:before {
content: "\e05e";
}
.fa-handshake-alt-slash:before {
content: "\e05f";
}
.fa-handshake-slash:before {
content: "\e060";
}
.fa-head-side-cough:before {
content: "\e061";
}
.fa-head-side-cough-slash:before {
content: "\e062";
}
.fa-head-side-mask:before {
content: "\e063";
}
.fa-head-side-virus:before {
content: "\e064";
}
.fa-house-user:before {
content: "\e065";
}
.fa-laptop-house:before {
content: "\e066";
}
.fa-lungs-virus:before {
content: "\e067";
}
.fa-people-arrows:before {
content: "\e068";
}
.fa-plane-slash:before {
content: "\e069";
}
.fa-pump-medical:before {
content: "\e06a";
}
.fa-pump-soap:before {
content: "\e06b";
}
.fa-shield-virus:before {
content: "\e06c";
}
.fa-sink:before {
content: "\e06d";
}
.fa-soap:before {
content: "\e06e";
}
.fa-stopwatch-20:before {
content: "\e06f";
}
.fa-store-alt-slash:before {
content: "\e070";
}
.fa-store-slash:before {
content: "\e071";
}
.fa-toilet-paper-slash:before {
content: "\e072";
}
.fa-users-slash:before {
content: "\e073";
}
.fa-virus:before {
content: "\e074";
}
.fa-virus-slash:before {
content: "\e075";
}
.fa-viruses:before {
content: "\e076";
}
.fa-glass-martini:before {
content: "\f000";
}
.fa-music:before {
content: "\f001";
}
.fa-search:before {
content: "\f002";
}
.fa-heart1:before {
content: "\f006";
}
.fa-star1:before {
content: "\f008";
}
.fa-user1:before {
content: "\f009";
}
.fa-film:before {
content: "\f00a";
}
.fa-th-large:before {
content: "\f00b";
}
.fa-th:before {
content: "\f00c";
}
.fa-th-list:before {
content: "\f00d";
}
.fa-check:before {
content: "\f00e";
}
.fa-times:before {
content: "\f00f";
}
.fa-search-plus:before {
content: "\f010";
}
.fa-search-minus:before {
content: "\f011";
}
.fa-power-off:before {
content: "\f012";
}
.fa-signal:before {
content: "\f013";
}
.fa-cog:before {
content: "\f014";
}
.fa-home:before {
content: "\f015";
}
.fa-clock1:before {
content: "\f018";
}
.fa-road:before {
content: "\f019";
}
.fa-download:before {
content: "\f01a";
}
.fa-inbox:before {
content: "\f01c";
}
.fa-redo:before {
content: "\f01e";
}
.fa-sync:before {
content: "\f021";
}
.fa-list-alt1:before {
content: "\f023";
}
.fa-lock:before {
content: "\f025";
}
.fa-flag1:before {
content: "\f026";
}
.fa-headphones:before {
content: "\f027";
}
.fa-volume-off:before {
content: "\f028";
}
.fa-volume-down:before {
content: "\f029";
}
.fa-volume-up:before {
content: "\f02a";
}
.fa-qrcode:before {
content: "\f02b";
}
.fa-barcode:before {
content: "\f02c";
}
.fa-tag:before {
content: "\f02d";
}
.fa-tags:before {
content: "\f02f";
}
.fa-book:before {
content: "\f030";
}
.fa-bookmark1:before {
content: "\f031";
}
.fa-print:before {
content: "\f032";
}
.fa-camera:before {
content: "\f033";
}
.fa-font:before {
content: "\f034";
}
.fa-bold:before {
content: "\f035";
}
.fa-italic:before {
content: "\f036";
}
.fa-text-height:before {
content: "\f037";
}
.fa-text-width:before {
content: "\f038";
}
.fa-align-left:before {
content: "\f039";
}
.fa-align-center:before {
content: "\f03a";
}
.fa-align-right:before {
content: "\f03b";
}
.fa-align-justify:before {
content: "\f03c";
}
.fa-list:before {
content: "\f03d";
}
.fa-outdent:before {
content: "\f03f";
}
.fa-indent:before {
content: "\f040";
}
.fa-video:before {
content: "\f041";
}
.fa-image1:before {
content: "\f042";
}
.fa-map-marker:before {
content: "\f043";
}
.fa-adjust:before {
content: "\f045";
}
.fa-tint:before {
content: "\f046";
}
.fa-edit1:before {
content: "\f047";
}
.fa-step-backward:before {
content: "\f048";
}
.fa-fast-backward:before {
content: "\f049";
}
.fa-backward:before {
content: "\f04a";
}
.fa-play:before {
content: "\f04b";
}
.fa-pause:before {
content: "\f04c";
}
.fa-stop:before {
content: "\f04d";
}
.fa-forward:before {
content: "\f04e";
}
.fa-fast-forward:before {
content: "\f050";
}
.fa-step-forward:before {
content: "\f051";
}
.fa-eject:before {
content: "\f052";
}
.fa-chevron-left:before {
content: "\f053";
}
.fa-chevron-right:before {
content: "\f054";
}
.fa-plus-circle:before {
content: "\f055";
}
.fa-minus-circle:before {
content: "\f056";
}
.fa-times-circle1:before {
content: "\f05a";
}
.fa-check-circle1:before {
content: "\f05b";
}
.fa-question-circle1:before {
content: "\f05c";
}
.fa-info-circle:before {
content: "\f05d";
}
.fa-crosshairs:before {
content: "\f05e";
}
.fa-ban:before {
content: "\f05f";
}
.fa-arrow-left:before {
content: "\f060";
}
.fa-arrow-right:before {
content: "\f061";
}
.fa-arrow-up:before {
content: "\f062";
}
.fa-arrow-down:before {
content: "\f063";
}
.fa-share:before {
content: "\f064";
}
.fa-expand:before {
content: "\f065";
}
.fa-compress:before {
content: "\f066";
}
.fa-plus:before {
content: "\f067";
}
.fa-minus:before {
content: "\f068";
}
.fa-asterisk:before {
content: "\f069";
}
.fa-exclamation-circle:before {
content: "\f06a";
}
.fa-gift:before {
content: "\f06b";
}
.fa-leaf:before {
content: "\f06c";
}
.fa-fire:before {
content: "\f06d";
}
.fa-eye1:before {
content: "\f06f";
}
.fa-eye-slash1:before {
content: "\f071";
}
.fa-exclamation-triangle:before {
content: "\f072";
}
.fa-plane:before {
content: "\f074";
}
.fa-calendar-alt1:before {
content: "\f076";
}
.fa-random:before {
content: "\f077";
}
.fa-comment1:before {
content: "\f078";
}
.fa-magnet:before {
content: "\f079";
}
.fa-chevron-up:before {
content: "\f07a";
}
.fa-chevron-down:before {
content: "\f07d";
}
.fa-retweet:before {
content: "\f07e";
}
.fa-shopping-cart:before {
content: "\f07f";
}
.fa-folder1:before {
content: "\f083";
}
.fa-folder-open1:before {
content: "\f084";
}
.fa-chart-bar1:before {
content: "\f085";
}
.fa-camera-retro:before {
content: "\f087";
}
.fa-key:before {
content: "\f088";
}
.fa-cogs:before {
content: "\f08a";
}
.fa-comments1:before {
content: "\f08b";
}
.fa-star-half1:before {
content: "\f08d";
}
.fa-thumbtack:before {
content: "\f08e";
}
.fa-trophy:before {
content: "\f091";
}
.fa-upload:before {
content: "\f093";
}
.fa-lemon1:before {
content: "\f095";
}
.fa-phone:before {
content: "\f096";
}
.fa-phone-square:before {
content: "\f098";
}
.fa-unlock:before {
content: "\f09c";
}
.fa-credit-card1:before {
content: "\f09e";
}
.fa-rss:before {
content: "\f09f";
}
.fa-hdd1:before {
content: "\f0a1";
}
.fa-bullhorn:before {
content: "\f0a2";
}
.fa-certificate:before {
content: "\f0a3";
}
.fa-hand-point-right1:before {
content: "\f0a8";
}
.fa-hand-point-left1:before {
content: "\f0a9";
}
.fa-hand-point-up1:before {
content: "\f0aa";
}
.fa-hand-point-down1:before {
content: "\f0ab";
}
.fa-arrow-circle-left:before {
content: "\f0ac";
}
.fa-arrow-circle-right:before {
content: "\f0ad";
}
.fa-arrow-circle-up:before {
content: "\f0ae";
}
.fa-arrow-circle-down:before {
content: "\f0af";
}
.fa-globe:before {
content: "\f0b0";
}
.fa-wrench:before {
content: "\f0b1";
}
.fa-tasks:before {
content: "\f0b2";
}
.fa-filter:before {
content: "\f0b3";
}
.fa-briefcase:before {
content: "\f0b4";
}
.fa-arrows-alt:before {
content: "\f0b5";
}
.fa-users:before {
content: "\f0c0";
}
.fa-link:before {
content: "\f0c1";
}
.fa-cloud:before {
content: "\f0c2";
}
.fa-flask:before {
content: "\f0c3";
}
.fa-cut:before {
content: "\f0c4";
}
.fa-copy1:before {
content: "\f0c6";
}
.fa-paperclip:before {
content: "\f0c9";
}
.fa-save1:before {
content: "\f0ca";
}
.fa-square1:before {
content: "\f0cb";
}
.fa-bars:before {
content: "\f0cc";
}
.fa-list-ul:before {
content: "\f0cd";
}
.fa-list-ol:before {
content: "\f0ce";
}
.fa-strikethrough:before {
content: "\f0cf";
}
.fa-underline:before {
content: "\f0d0";
}
.fa-table:before {
content: "\f0d1";
}
.fa-magic:before {
content: "\f0d6";
}
.fa-truck:before {
content: "\f0d7";
}
.fa-money-bill:before {
content: "\f0d8";
}
.fa-caret-down:before {
content: "\f0d9";
}
.fa-caret-up:before {
content: "\f0da";
}
.fa-caret-left:before {
content: "\f0db";
}
.fa-caret-right:before {
content: "\f0dc";
}
.fa-columns:before {
content: "\f0dd";
}
.fa-sort:before {
content: "\f0de";
}
.fa-sort-down:before {
content: "\f0df";
}
.fa-sort-up:before {
content: "\f0e2";
}
.fa-envelope1:before {
content: "\f0e3";
}
.fa-undo:before {
content: "\f0e4";
}
.fa-gavel:before {
content: "\f0e5";
}
.fa-bolt:before {
content: "\f0e7";
}
.fa-sitemap:before {
content: "\f0e8";
}
.fa-umbrella:before {
content: "\f0e9";
}
.fa-paste:before {
content: "\f0ea";
}
.fa-lightbulb1:before {
content: "\f0ec";
}
.fa-user-md:before {
content: "\f0f0";
}
.fa-stethoscope:before {
content: "\f0f1";
}
.fa-suitcase:before {
content: "\f0f2";
}
.fa-bell1:before {
content: "\f0f4";
}
.fa-coffee:before {
content: "\f0f5";
}
.fa-hospital1:before {
content: "\f0f9";
}
.fa-ambulance:before {
content: "\f0fa";
}
.fa-medkit:before {
content: "\f0fb";
}
.fa-fighter-jet:before {
content: "\f0fc";
}
.fa-beer:before {
content: "\f0fd";
}
.fa-h-square:before {
content: "\f0ff";
}
.fa-plus-square1:before {
content: "\f100";
}
.fa-angle-double-left:before {
content: "\f101";
}
.fa-angle-double-right:before {
content: "\f102";
}
.fa-angle-double-up:before {
content: "\f103";
}
.fa-angle-double-down:before {
content: "\f104";
}
.fa-angle-left:before {
content: "\f105";
}
.fa-angle-right:before {
content: "\f106";
}
.fa-angle-up:before {
content: "\f107";
}
.fa-angle-down:before {
content: "\f108";
}
.fa-desktop:before {
content: "\f109";
}
.fa-laptop:before {
content: "\f10a";
}
.fa-tablet:before {
content: "\f10b";
}
.fa-mobile:before {
content: "\f10c";
}
.fa-quote-left:before {
content: "\f10d";
}
.fa-quote-right:before {
content: "\f10e";
}
.fa-spinner:before {
content: "\f110";
}
.fa-circle1:before {
content: "\f112";
}
.fa-smile1:before {
content: "\f11b";
}
.fa-frown1:before {
content: "\f11d";
}
.fa-meh1:before {
content: "\f11e";
}
.fa-gamepad:before {
content: "\f11f";
}
.fa-keyboard1:before {
content: "\f120";
}
.fa-flag-checkered:before {
content: "\f121";
}
.fa-terminal:before {
content: "\f122";
}
.fa-code:before {
content: "\f123";
}
.fa-reply-all:before {
content: "\f124";
}
.fa-location-arrow:before {
content: "\f125";
}
.fa-crop:before {
content: "\f126";
}
.fa-code-branch:before {
content: "\f127";
}
.fa-unlink:before {
content: "\f128";
}
.fa-question:before {
content: "\f129";
}
.fa-info:before {
content: "\f12a";
}
.fa-exclamation:before {
content: "\f12b";
}
.fa-superscript:before {
content: "\f12c";
}
.fa-subscript:before {
content: "\f12d";
}
.fa-eraser:before {
content: "\f12e";
}
.fa-puzzle-piece:before {
content: "\f12f";
}
.fa-microphone:before {
content: "\f130";
}
.fa-microphone-slash:before {
content: "\f131";
}
.fa-calendar1:before {
content: "\f134";
}
.fa-fire-extinguisher:before {
content: "\f135";
}
.fa-rocket:before {
content: "\f137";
}
.fa-chevron-circle-left:before {
content: "\f138";
}
.fa-chevron-circle-right:before {
content: "\f139";
}
.fa-chevron-circle-up:before {
content: "\f13a";
}
.fa-chevron-circle-down:before {
content: "\f13d";
}
.fa-anchor:before {
content: "\f13e";
}
.fa-unlock-alt:before {
content: "\f13f";
}
.fa-bullseye:before {
content: "\f140";
}
.fa-ellipsis-h:before {
content: "\f141";
}
.fa-ellipsis-v:before {
content: "\f142";
}
.fa-rss-square:before {
content: "\f143";
}
.fa-play-circle1:before {
content: "\f145";
}
.fa-minus-square1:before {
content: "\f147";
}
.fa-check-square1:before {
content: "\f14b";
}
.fa-pen-square:before {
content: "\f14c";
}
.fa-share-square1:before {
content: "\f14f";
}
.fa-compass1:before {
content: "\f153";
}
.fa-caret-square-down1:before {
content: "\f154";
}
.fa-caret-square-up1:before {
content: "\f155";
}
.fa-caret-square-right1:before {
content: "\f156";
}
.fa-euro-sign:before {
content: "\f157";
}
.fa-pound-sign:before {
content: "\f158";
}
.fa-rupee-sign:before {
content: "\f15d";
}
.fa-yen-sign:before {
content: "\f15e";
}
.fa-ruble-sign:before {
content: "\f15f";
}
.fa-won-sign:before {
content: "\f160";
}
.fa-file1:before {
content: "\f161";
}
.fa-file-alt1:before {
content: "\f162";
}
.fa-sort-alpha-down:before {
content: "\f163";
}
.fa-sort-alpha-up:before {
content: "\f166";
}
.fa-sort-amount-down:before {
content: "\f16a";
}
.fa-sort-amount-up:before {
content: "\f16f";
}
.fa-sort-numeric-down:before {
content: "\f172";
}
.fa-sort-numeric-up:before {
content: "\f175";
}
.fa-thumbs-up1:before {
content: "\f176";
}
.fa-thumbs-down1:before {
content: "\f177";
}
.fa-female:before {
content: "\f182";
}
.fa-male:before {
content: "\f183";
}
.fa-sun1:before {
content: "\f187";
}
.fa-moon1:before {
content: "\f188";
}
.fa-archive:before {
content: "\f18e";
}
.fa-bug:before {
content: "\f18f";
}
.fa-caret-square-left1:before {
content: "\f193";
}
.fa-dot-circle1:before {
content: "\f195";
}
.fa-wheelchair:before {
content: "\f196";
}
.fa-lira-sign:before {
content: "\f197";
}
.fa-space-shuttle:before {
content: "\f199";
}
.fa-envelope-square:before {
content: "\f19c";
}
.fa-university:before {
content: "\f19d";
}
.fa-graduation-cap:before {
content: "\f19f";
}
.fa-language:before {
content: "\f1ab";
}
.fa-fax:before {
content: "\f1ac";
}
.fa-building1:before {
content: "\f1ae";
}
.fa-child:before {
content: "\f1af";
}
.fa-paw:before {
content: "\f1b0";
}
.fa-cube:before {
content: "\f1b2";
}
.fa-cubes:before {
content: "\f1b3";
}
.fa-recycle:before {
content: "\f1b8";
}
.fa-car:before {
content: "\f1b9";
}
.fa-taxi:before {
content: "\f1ba";
}
.fa-tree:before {
content: "\f1bb";
}
.fa-database:before {
content: "\f1c0";
}
.fa-file-pdf1:before {
content: "\f1ce";
}
.fa-file-word1:before {
content: "\f1cf";
}
.fa-file-excel1:before {
content: "\f1d9";
}
.fa-file-powerpoint1:before {
content: "\f1da";
}
.fa-file-image1:before {
content: "\f1db";
}
.fa-file-archive1:before {
content: "\f1dc";
}
.fa-file-audio1:before {
content: "\f1dd";
}
.fa-file-video1:before {
content: "\f1de";
}
.fa-file-code1:before {
content: "\f1df";
}
.fa-life-ring1:before {
content: "\f1e0";
}
.fa-circle-notch:before {
content: "\f1e1";
}
.fa-paper-plane1:before {
content: "\f1e2";
}
.fa-history:before {
content: "\f1e4";
}
.fa-heading:before {
content: "\f1e5";
}
.fa-paragraph:before {
content: "\f1e6";
}
.fa-sliders-h:before {
content: "\f1eb";
}
.fa-share-alt:before {
content: "\f1ec";
}
.fa-share-alt-square:before {
content: "\f1ef";
}
.fa-bomb:before {
content: "\f1f7";
}
.fa-futbol1:before {
content: "\f1f8";
}
.fa-tty:before {
content: "\f1fa";
}
.fa-binoculars:before {
content: "\f1fb";
}
.fa-plug:before {
content: "\f1fc";
}
.fa-newspaper1:before {
content: "\f1fd";
}
.fa-wifi:before {
content: "\f1fe";
}
.fa-calculator:before {
content: "\f1ff";
}
.fa-bell-slash1:before {
content: "\f200";
}
.fa-trash:before {
content: "\f201";
}
.fa-copyright1:before {
content: "\f204";
}
.fa-at:before {
content: "\f205";
}
.fa-eye-dropper:before {
content: "\f206";
}
.fa-paint-brush:before {
content: "\f207";
}
.fa-birthday-cake:before {
content: "\f20b";
}
.fa-chart-area:before {
content: "\f20c";
}
.fa-chart-pie:before {
content: "\f20f";
}
.fa-chart-line:before {
content: "\f217";
}
.fa-toggle-off:before {
content: "\f218";
}
.fa-toggle-on:before {
content: "\f219";
}
.fa-bicycle:before {
content: "\f21a";
}
.fa-bus:before {
content: "\f21b";
}
.fa-closed-captioning1:before {
content: "\f21c";
}
.fa-shekel-sign:before {
content: "\f21d";
}
.fa-cart-plus:before {
content: "\f21e";
}
.fa-cart-arrow-down:before {
content: "\f21f";
}
.fa-ship:before {
content: "\f220";
}
.fa-user-secret:before {
content: "\f221";
}
.fa-motorcycle:before {
content: "\f222";
}
.fa-street-view:before {
content: "\f223";
}
.fa-heartbeat:before {
content: "\f224";
}
.fa-venus:before {
content: "\f225";
}
.fa-mars:before {
content: "\f226";
}
.fa-mercury:before {
content: "\f227";
}
.fa-transgender:before {
content: "\f228";
}
.fa-transgender-alt:before {
content: "\f229";
}
.fa-venus-double:before {
content: "\f22a";
}
.fa-mars-double:before {
content: "\f22b";
}
.fa-venus-mars:before {
content: "\f22c";
}
.fa-mars-stroke:before {
content: "\f22d";
}
.fa-mars-stroke-v:before {
content: "\f22e";
}
.fa-mars-stroke-h:before {
content: "\f22f";
}
.fa-neuter:before {
content: "\f230";
}
.fa-genderless:before {
content: "\f233";
}
.fa-server:before {
content: "\f234";
}
.fa-user-plus:before {
content: "\f235";
}
.fa-user-times:before {
content: "\f236";
}
.fa-bed:before {
content: "\f238";
}
.fa-train:before {
content: "\f239";
}
.fa-subway:before {
content: "\f23f";
}
.fa-battery-full:before {
content: "\f240";
}
.fa-battery-three-quarters:before {
content: "\f241";
}
.fa-battery-half:before {
content: "\f242";
}
.fa-battery-quarter:before {
content: "\f243";
}
.fa-battery-empty:before {
content: "\f244";
}
.fa-mouse-pointer:before {
content: "\f245";
}
.fa-i-cursor:before {
content: "\f246";
}
.fa-object-group1:before {
content: "\f24a";
}
.fa-object-ungroup1:before {
content: "\f24e";
}
.fa-sticky-note1:before {
content: "\f24f";
}
.fa-clone1:before {
content: "\f250";
}
.fa-balance-scale:before {
content: "\f251";
}
.fa-hourglass-start:before {
content: "\f252";
}
.fa-hourglass-half:before {
content: "\f253";
}
.fa-hourglass-end:before {
content: "\f25c";
}
.fa-hourglass1:before {
content: "\f25f";
}
.fa-hand-rock1:before {
content: "\f26c";
}
.fa-hand-paper1:before {
content: "\f26f";
}
.fa-hand-scissors1:before {
content: "\f275";
}
.fa-hand-lizard1:before {
content: "\f276";
}
.fa-hand-spock1:before {
content: "\f277";
}
.fa-hand-pointer1:before {
content: "\f278";
}
.fa-hand-peace1:before {
content: "\f27b";
}
.fa-trademark:before {
content: "\f27f";
}
.fa-registered1:before {
content: "\f283";
}
.fa-tv:before {
content: "\f28c";
}
.fa-calendar-plus1:before {
content: "\f28e";
}
.fa-calendar-minus1:before {
content: "\f28f";
}
.fa-calendar-times1:before {
content: "\f290";
}
.fa-calendar-check1:before {
content: "\f291";
}
.fa-industry:before {
content: "\f292";
}
.fa-map-pin:before {
content: "\f295";
}
.fa-map-signs:before {
content: "\f29a";
}
.fa-map1:before {
content: "\f29b";
}
.fa-comment-alt1:before {
content: "\f29c";
}
.fa-pause-circle1:before {
content: "\f29d";
}
.fa-stop-circle1:before {
content: "\f29e";
}
.fa-shopping-bag:before {
content: "\f29f";
}
.fa-shopping-basket:before {
content: "\f2a0";
}
.fa-hashtag:before {
content: "\f2a1";
}
.fa-percent:before {
content: "\f2a2";
}
.fa-universal-access:before {
content: "\f2a3";
}
.fa-blind:before {
content: "\f2a4";
}
.fa-audio-description:before {
content: "\f2a7";
}
.fa-phone-volume:before {
content: "\f2a8";
}
.fa-braille:before {
content: "\f2af";
}
.fa-assistive-listening-systems:before {
content: "\f2b7";
}
.fa-american-sign-language-interpreting:before {
content: "\f2ba";
}
.fa-deaf:before {
content: "\f2bc";
}
.fa-sign-language:before {
content: "\f2be";
}
.fa-low-vision:before {
content: "\f2bf";
}
.fa-handshake1:before {
content: "\f2c0";
}
.fa-envelope-open1:before {
content: "\f2c3";
}
.fa-address-book1:before {
content: "\f2c7";
}
.fa-address-card1:before {
content: "\f2c8";
}
.fa-user-circle1:before {
content: "\f2c9";
}
.fa-id-badge1:before {
content: "\f2ca";
}
.fa-id-card1:before {
content: "\f2cb";
}
.fa-thermometer-full:before {
content: "\f2cc";
}
.fa-thermometer-three-quarters:before {
content: "\f2cd";
}
.fa-thermometer-half:before {
content: "\f2ce";
}
.fa-thermometer-quarter:before {
content: "\f2cf";
}
.fa-thermometer-empty:before {
content: "\f2d3";
}
.fa-shower:before {
content: "\f2d4";
}
.fa-bath:before {
content: "\f2db";
}
.fa-podcast:before {
content: "\f2df";
}
.fa-window-maximize1:before {
content: "\f2e1";
}
.fa-window-minimize1:before {
content: "\f2e2";
}
.fa-window-restore1:before {
content: "\f2e3";
}
.fa-microchip:before {
content: "\f2e4";
}
.fa-snowflake1:before {
content: "\f2e5";
}
.fa-utensil-spoon:before {
content: "\f2e6";
}
.fa-utensils:before {
content: "\f2e7";
}
.fa-undo-alt:before {
content: "\f2ea";
}
.fa-trash-alt1:before {
content: "\f2ee";
}
.fa-sync-alt:before {
content: "\f2f1";
}
.fa-stopwatch:before {
content: "\f2f2";
}
.fa-sign-out-alt:before {
content: "\f2f5";
}
.fa-sign-in-alt:before {
content: "\f2f6";
}
.fa-redo-alt:before {
content: "\f2f9";
}
.fa-poo:before {
content: "\f2fe";
}
.fa-images1:before {
content: "\f303";
}
.fa-pencil-alt:before {
content: "\f304";
}
.fa-pen:before {
content: "\f305";
}
.fa-pen-alt:before {
content: "\f306";
}
.fa-long-arrow-alt-down:before {
content: "\f309";
}
.fa-long-arrow-alt-left:before {
content: "\f30a";
}
.fa-long-arrow-alt-right:before {
content: "\f30b";
}
.fa-long-arrow-alt-up:before {
content: "\f30c";
}
.fa-expand-arrows-alt:before {
content: "\f31e";
}
.fa-clipboard1:before {
content: "\f329";
}
.fa-arrows-alt-h:before {
content: "\f337";
}
.fa-arrows-alt-v:before {
content: "\f338";
}
.fa-arrow-alt-circle-down1:before {
content: "\f35d";
}
.fa-arrow-alt-circle-left1:before {
content: "\f35e";
}
.fa-arrow-alt-circle-right1:before {
content: "\f35f";
}
.fa-arrow-alt-circle-up1:before {
content: "\f360";
}
.fa-external-link-alt:before {
content: "\f361";
}
.fa-external-link-square-alt:before {
content: "\f362";
}
.fa-exchange-alt:before {
content: "\f363";
}
.fa-cloud-download-alt:before {
content: "\f381";
}
.fa-cloud-upload-alt:before {
content: "\f382";
}
.fa-gem1:before {
content: "\f3b3";
}
.fa-level-down-alt:before {
content: "\f3be";
}
.fa-level-up-alt:before {
content: "\f3bf";
}
.fa-lock-open:before {
content: "\f3c1";
}
.fa-map-marker-alt:before {
content: "\f3c5";
}
.fa-microphone-alt:before {
content: "\f3c9";
}
.fa-mobile-alt:before {
content: "\f3cd";
}
.fa-money-bill-alt1:before {
content: "\f3dd";
}
.fa-phone-slash:before {
content: "\f3de";
}
.fa-portrait:before {
content: "\f3e0";
}
.fa-reply:before {
content: "\f3e5";
}
.fa-shield-alt:before {
content: "\f3ed";
}
.fa-tablet-alt:before {
content: "\f3fa";
}
.fa-tachometer-alt:before {
content: "\f3fd";
}
.fa-ticket-alt:before {
content: "\f3ff";
}
.fa-user-alt:before {
content: "\f406";
}
.fa-window-close1:before {
content: "\f418";
}
.fa-compress-alt:before {
content: "\f422";
}
.fa-expand-alt:before {
content: "\f424";
}
.fa-baseball-ball:before {
content: "\f433";
}
.fa-basketball-ball:before {
content: "\f434";
}
.fa-bowling-ball:before {
content: "\f436";
}
.fa-chess:before {
content: "\f439";
}
.fa-chess-bishop:before {
content: "\f43a";
}
.fa-chess-board:before {
content: "\f43c";
}
.fa-chess-king:before {
content: "\f43f";
}
.fa-chess-knight:before {
content: "\f441";
}
.fa-chess-pawn:before {
content: "\f443";
}
.fa-chess-queen:before {
content: "\f445";
}
.fa-chess-rook:before {
content: "\f447";
}
.fa-dumbbell:before {
content: "\f44b";
}
.fa-football-ball:before {
content: "\f44e";
}
.fa-golf-ball:before {
content: "\f450";
}
.fa-hockey-puck:before {
content: "\f453";
}
.fa-quidditch:before {
content: "\f458";
}
.fa-square-full:before {
content: "\f45c";
}
.fa-table-tennis:before {
content: "\f45d";
}
.fa-volleyball-ball:before {
content: "\f45f";
}
.fa-allergies:before {
content: "\f461";
}
.fa-band-aid:before {
content: "\f462";
}
.fa-box:before {
content: "\f466";
}
.fa-boxes:before {
content: "\f468";
}
.fa-briefcase-medical:before {
content: "\f469";
}
.fa-burn:before {
content: "\f46a";
}
.fa-capsules:before {
content: "\f46b";
}
.fa-clipboard-check:before {
content: "\f46c";
}
.fa-clipboard-list:before {
content: "\f46d";
}
.fa-diagnoses:before {
content: "\f470";
}
.fa-dna:before {
content: "\f471";
}
.fa-dolly:before {
content: "\f472";
}
.fa-dolly-flatbed:before {
content: "\f474";
}
.fa-file-medical:before {
content: "\f477";
}
.fa-file-medical-alt:before {
content: "\f478";
}
.fa-first-aid:before {
content: "\f479";
}
.fa-hospital-alt:before {
content: "\f47d";
}
.fa-hospital-symbol:before {
content: "\f47e";
}
.fa-id-card-alt:before {
content: "\f47f";
}
.fa-notes-medical:before {
content: "\f481";
}
.fa-pallet:before {
content: "\f482";
}
.fa-pills:before {
content: "\f484";
}
.fa-prescription-bottle:before {
content: "\f485";
}
.fa-prescription-bottle-alt:before {
content: "\f486";
}
.fa-procedures:before {
content: "\f487";
}
.fa-shipping-fast:before {
content: "\f48b";
}
.fa-smoking:before {
content: "\f48d";
}
.fa-syringe:before {
content: "\f48e";
}
.fa-tablets:before {
content: "\f490";
}
.fa-thermometer:before {
content: "\f491";
}
.fa-vial:before {
content: "\f492";
}
.fa-vials:before {
content: "\f493";
}
.fa-warehouse:before {
content: "\f494";
}
.fa-weight:before {
content: "\f496";
}
.fa-x-ray:before {
content: "\f497";
}
.fa-box-open:before {
content: "\f49e";
}
.fa-comment-dots1:before {
content: "\f4ae";
}
.fa-comment-slash:before {
content: "\f4b3";
}
.fa-couch:before {
content: "\f4b8";
}
.fa-donate:before {
content: "\f4b9";
}
.fa-dove:before {
content: "\f4ba";
}
.fa-hand-holding:before {
content: "\f4bd";
}
.fa-hand-holding-heart:before {
content: "\f4be";
}
.fa-hand-holding-usd:before {
content: "\f4c0";
}
.fa-hand-holding-water:before {
content: "\f4c1";
}
.fa-hands:before {
content: "\f4c2";
}
.fa-hands-helping:before {
content: "\f4c4";
}
.fa-parachute-box:before {
content: "\f4cd";
}
.fa-people-carry:before {
content: "\f4ce";
}
.fa-piggy-bank:before {
content: "\f4d3";
}
.fa-ribbon:before {
content: "\f4d6";
}
.fa-route:before {
content: "\f4d7";
}
.fa-seedling:before {
content: "\f4d8";
}
.fa-sign:before {
content: "\f4d9";
}
.fa-smile-wink1:before {
content: "\f4db";
}
.fa-tape:before {
content: "\f4dc";
}
.fa-truck-loading:before {
content: "\f4de";
}
.fa-truck-moving:before {
content: "\f4df";
}
.fa-video-slash:before {
content: "\f4e2";
}
.fa-wine-glass:before {
content: "\f4e3";
}
.fa-user-alt-slash:before {
content: "\f4fa";
}
.fa-user-astronaut:before {
content: "\f4fb";
}
.fa-user-check:before {
content: "\f4fc";
}
.fa-user-clock:before {
content: "\f4fd";
}
.fa-user-cog:before {
content: "\f4fe";
}
.fa-user-edit:before {
content: "\f4ff";
}
.fa-user-friends:before {
content: "\f500";
}
.fa-user-graduate:before {
content: "\f501";
}
.fa-user-lock:before {
content: "\f502";
}
.fa-user-minus:before {
content: "\f503";
}
.fa-user-ninja:before {
content: "\f504";
}
.fa-user-shield:before {
content: "\f505";
}
.fa-user-slash:before {
content: "\f506";
}
.fa-user-tag:before {
content: "\f507";
}
.fa-user-tie:before {
content: "\f508";
}
.fa-users-cog:before {
content: "\f509";
}
.fa-balance-scale-left:before {
content: "\f515";
}
.fa-balance-scale-right:before {
content: "\f516";
}
.fa-blender:before {
content: "\f517";
}
.fa-book-open:before {
content: "\f518";
}
.fa-broadcast-tower:before {
content: "\f519";
}
.fa-broom:before {
content: "\f51a";
}
.fa-chalkboard:before {
content: "\f51b";
}
.fa-chalkboard-teacher:before {
content: "\f51c";
}
.fa-church:before {
content: "\f51d";
}
.fa-coins:before {
content: "\f51e";
}
.fa-compact-disc:before {
content: "\f51f";
}
.fa-crow:before {
content: "\f520";
}
.fa-crown:before {
content: "\f521";
}
.fa-dice:before {
content: "\f522";
}
.fa-dice-five:before {
content: "\f523";
}
.fa-dice-four:before {
content: "\f524";
}
.fa-dice-one:before {
content: "\f525";
}
.fa-dice-six:before {
content: "\f526";
}
.fa-dice-three:before {
content: "\f527";
}
.fa-dice-two:before {
content: "\f528";
}
.fa-divide:before {
content: "\f529";
}
.fa-door-closed:before {
content: "\f52a";
}
.fa-door-open:before {
content: "\f52b";
}
.fa-equals:before {
content: "\f52c";
}
.fa-feather:before {
content: "\f52d";
}
.fa-frog:before {
content: "\f52e";
}
.fa-gas-pump:before {
content: "\f52f";
}
.fa-glasses:before {
content: "\f530";
}
.fa-greater-than:before {
content: "\f531";
}
.fa-greater-than-equal:before {
content: "\f532";
}
.fa-helicopter:before {
content: "\f533";
}
.fa-infinity:before {
content: "\f534";
}
.fa-kiwi-bird:before {
content: "\f535";
}
.fa-less-than:before {
content: "\f536";
}
.fa-less-than-equal:before {
content: "\f537";
}
.fa-memory:before {
content: "\f538";
}
.fa-microphone-alt-slash:before {
content: "\f539";
}
.fa-money-bill-wave:before {
content: "\f53a";
}
.fa-money-bill-wave-alt:before {
content: "\f53b";
}
.fa-money-check:before {
content: "\f53c";
}
.fa-money-check-alt:before {
content: "\f53d";
}
.fa-not-equal:before {
content: "\f53e";
}
.fa-palette:before {
content: "\f53f";
}
.fa-parking:before {
content: "\f540";
}
.fa-percentage:before {
content: "\f541";
}
.fa-project-diagram:before {
content: "\f542";
}
.fa-receipt:before {
content: "\f543";
}
.fa-robot:before {
content: "\f544";
}
.fa-ruler:before {
content: "\f545";
}
.fa-ruler-combined:before {
content: "\f546";
}
.fa-ruler-horizontal:before {
content: "\f547";
}
.fa-ruler-vertical:before {
content: "\f548";
}
.fa-school:before {
content: "\f549";
}
.fa-screwdriver:before {
content: "\f54a";
}
.fa-shoe-prints:before {
content: "\f54b";
}
.fa-skull:before {
content: "\f54c";
}
.fa-smoking-ban:before {
content: "\f54d";
}
.fa-store:before {
content: "\f54e";
}
.fa-store-alt:before {
content: "\f54f";
}
.fa-stream:before {
content: "\f550";
}
.fa-stroopwafel:before {
content: "\f551";
}
.fa-toolbox:before {
content: "\f552";
}
.fa-tshirt:before {
content: "\f553";
}
.fa-walking:before {
content: "\f554";
}
.fa-wallet:before {
content: "\f555";
}
.fa-angry1:before {
content: "\f557";
}
.fa-archway:before {
content: "\f558";
}
.fa-atlas:before {
content: "\f559";
}
.fa-award:before {
content: "\f55a";
}
.fa-backspace:before {
content: "\f55b";
}
.fa-bezier-curve:before {
content: "\f55c";
}
.fa-bong:before {
content: "\f55d";
}
.fa-brush:before {
content: "\f55e";
}
.fa-bus-alt:before {
content: "\f55f";
}
.fa-cannabis:before {
content: "\f560";
}
.fa-check-double:before {
content: "\f561";
}
.fa-cocktail:before {
content: "\f562";
}
.fa-concierge-bell:before {
content: "\f563";
}
.fa-cookie:before {
content: "\f564";
}
.fa-cookie-bite:before {
content: "\f565";
}
.fa-crop-alt:before {
content: "\f566";
}
.fa-digital-tachograph:before {
content: "\f568";
}
.fa-dizzy1:before {
content: "\f569";
}
.fa-drafting-compass:before {
content: "\f56a";
}
.fa-drum:before {
content: "\f56b";
}
.fa-drum-steelpan:before {
content: "\f56c";
}
.fa-feather-alt:before {
content: "\f56d";
}
.fa-file-contract:before {
content: "\f56e";
}
.fa-file-download:before {
content: "\f56f";
}
.fa-file-export:before {
content: "\f570";
}
.fa-file-import:before {
content: "\f571";
}
.fa-file-invoice:before {
content: "\f572";
}
.fa-file-prescription:before {
content: "\f574";
}
.fa-file-signature:before {
content: "\f575";
}
.fa-file-upload:before {
content: "\f576";
}
.fa-fill:before {
content: "\f577";
}
.fa-fill-drip:before {
content: "\f578";
}
.fa-fingerprint:before {
content: "\f57b";
}
.fa-fish:before {
content: "\f57c";
}
.fa-flushed1:before {
content: "\f57d";
}
.fa-frown-open1:before {
content: "\f57e";
}
.fa-glass-martini-alt:before {
content: "\f58d";
}
.fa-globe-africa:before {
content: "\f58e";
}
.fa-globe-americas:before {
content: "\f58f";
}
.fa-globe-asia:before {
content: "\f590";
}
.fa-grimace1:before {
content: "\f591";
}
.fa-grin1:before {
content: "\f593";
}
.fa-grin-alt1:before {
content: "\f594";
}
.fa-grin-beam1:before {
content: "\f595";
}
.fa-grin-beam-sweat1:before {
content: "\f59d";
}
.fa-grin-hearts1:before {
content: "\f59f";
}
.fa-grin-squint1:before {
content: "\f5a0";
}
.fa-grin-squint-tears1:before {
content: "\f5a1";
}
.fa-grin-stars1:before {
content: "\f5a2";
}
.fa-grin-tears1:before {
content: "\f5a6";
}
.fa-grin-tongue1:before {
content: "\f5a7";
}
.fa-grin-tongue-squint1:before {
content: "\f5a9";
}
.fa-grin-tongue-wink1:before {
content: "\f5aa";
}
.fa-grin-wink1:before {
content: "\f5ab";
}
.fa-grip-horizontal:before {
content: "\f5ac";
}
.fa-grip-vertical:before {
content: "\f5ad";
}
.fa-headphones-alt:before {
content: "\f5ae";
}
.fa-headset:before {
content: "\f5af";
}
.fa-highlighter:before {
content: "\f5b0";
}
.fa-hot-tub:before {
content: "\f5b1";
}
.fa-hotel:before {
content: "\f5b6";
}
.fa-joint:before {
content: "\f5b7";
}
.fa-kiss1:before {
content: "\f5b9";
}
.fa-kiss-beam1:before {
content: "\f5ba";
}
.fa-kiss-wink-heart1:before {
content: "\f5bb";
}
.fa-laugh1:before {
content: "\f5bc";
}
.fa-laugh-beam1:before {
content: "\f5bd";
}
.fa-laugh-squint1:before {
content: "\f5bf";
}
.fa-laugh-wink1:before {
content: "\f5c0";
}
.fa-luggage-cart:before {
content: "\f5c1";
}
.fa-map-marked:before {
content: "\f5c3";
}
.fa-map-marked-alt:before {
content: "\f5c4";
}
.fa-marker:before {
content: "\f5c5";
}
.fa-medal:before {
content: "\f5c7";
}
.fa-meh-blank1:before {
content: "\f5c9";
}
.fa-meh-rolling-eyes1:before {
content: "\f5ca";
}
.fa-monument:before {
content: "\f5cb";
}
.fa-mortar-pestle:before {
content: "\f5cd";
}
.fa-paint-roller:before {
content: "\f5ce";
}
.fa-passport:before {
content: "\f5d0";
}
.fa-pen-fancy:before {
content: "\f5d1";
}
.fa-pen-nib:before {
content: "\f5d2";
}
.fa-pencil-ruler:before {
content: "\f5d3";
}
.fa-plane-arrival:before {
content: "\f5d4";
}
.fa-plane-departure:before {
content: "\f5d5";
}
.fa-prescription:before {
content: "\f5d6";
}
.fa-sad-cry1:before {
content: "\f5d7";
}
.fa-sad-tear1:before {
content: "\f5d8";
}
.fa-shuttle-van:before {
content: "\f5d9";
}
.fa-signature:before {
content: "\f5da";
}
.fa-smile-beam1:before {
content: "\f5db";
}
.fa-solar-panel:before {
content: "\f5dc";
}
.fa-spa:before {
content: "\f5dd";
}
.fa-splotch:before {
content: "\f5de";
}
.fa-spray-can:before {
content: "\f5df";
}
.fa-stamp:before {
content: "\f5e0";
}
.fa-star-half-alt:before {
content: "\f5e1";
}
.fa-suitcase-rolling:before {
content: "\f5e2";
}
.fa-surprise1:before {
content: "\f5e3";
}
.fa-swatchbook:before {
content: "\f5e4";
}
.fa-swimmer:before {
content: "\f5e5";
}
.fa-swimming-pool:before {
content: "\f5e6";
}
.fa-tint-slash:before {
content: "\f5e7";
}
.fa-tired1:before {
content: "\f5e8";
}
.fa-tooth:before {
content: "\f5e9";
}
.fa-umbrella-beach:before {
content: "\f5ea";
}
.fa-vector-square:before {
content: "\f5eb";
}
.fa-weight-hanging:before {
content: "\f5ec";
}
.fa-wine-glass-alt:before {
content: "\f5ed";
}
.fa-air-freshener:before {
content: "\f5ee";
}
.fa-apple-alt:before {
content: "\f5ef";
}
.fa-atom:before {
content: "\f5f0";
}
.fa-bone:before {
content: "\f5f2";
}
.fa-book-reader:before {
content: "\f5f3";
}
.fa-brain:before {
content: "\f5f4";
}
.fa-car-alt:before {
content: "\f5f5";
}
.fa-car-battery:before {
content: "\f5f6";
}
.fa-car-crash:before {
content: "\f5f8";
}
.fa-car-side:before {
content: "\f5f9";
}
.fa-charging-station:before {
content: "\f5fb";
}
.fa-directions:before {
content: "\f5fc";
}
.fa-draw-polygon:before {
content: "\f5fd";
}
.fa-laptop-code:before {
content: "\f5fe";
}
.fa-layer-group:before {
content: "\f5ff";
}
.fa-lungs:before {
content: "\f604";
}
.fa-microscope:before {
content: "\f610";
}
.fa-oil-can:before {
content: "\f613";
}
.fa-poop:before {
content: "\f619";
}
.fa-shapes:before {
content: "\f61f";
}
.fa-star-of-life:before {
content: "\f621";
}
.fa-teeth:before {
content: "\f62e";
}
.fa-teeth-open:before {
content: "\f62f";
}
.fa-theater-masks:before {
content: "\f630";
}
.fa-traffic-light:before {
content: "\f637";
}
.fa-truck-monster:before {
content: "\f63b";
}
.fa-truck-pickup:before {
content: "\f63c";
}
.fa-ad:before {
content: "\f641";
}
.fa-ankh:before {
content: "\f644";
}
.fa-bible:before {
content: "\f647";
}
.fa-business-time:before {
content: "\f64a";
}
.fa-city:before {
content: "\f64f";
}
.fa-cross:before {
content: "\f654";
}
.fa-dharmachakra:before {
content: "\f655";
}
.fa-envelope-open-text:before {
content: "\f658";
}
.fa-folder-minus:before {
content: "\f65d";
}
.fa-folder-plus:before {
content: "\f65e";
}
.fa-gopuram:before {
content: "\f664";
}
.fa-hamsa:before {
content: "\f665";
}
.fa-bahai:before {
content: "\f666";
}
.fa-jedi:before {
content: "\f669";
}
.fa-journal-whills:before {
content: "\f66a";
}
.fa-kaaba:before {
content: "\f66b";
}
.fa-khanda:before {
content: "\f66d";
}
.fa-landmark:before {
content: "\f66f";
}
.fa-mail-bulk:before {
content: "\f674";
}
.fa-menorah:before {
content: "\f676";
}
.fa-mosque:before {
content: "\f678";
}
.fa-om:before {
content: "\f679";
}
.fa-pastafarianism:before {
content: "\f67b";
}
.fa-peace:before {
content: "\f67c";
}
.fa-place-of-worship:before {
content: "\f67f";
}
.fa-poll:before {
content: "\f681";
}
.fa-poll-h:before {
content: "\f682";
}
.fa-pray:before {
content: "\f683";
}
.fa-praying-hands:before {
content: "\f684";
}
.fa-quran:before {
content: "\f687";
}
.fa-search-location:before {
content: "\f689";
}
.fa-socks:before {
content: "\f696";
}
.fa-square-root-alt:before {
content: "\f698";
}
.fa-star-and-crescent:before {
content: "\f699";
}
.fa-star-of-david:before {
content: "\f69a";
}
.fa-synagogue:before {
content: "\f69b";
}
.fa-torah:before {
content: "\f6a0";
}
.fa-torii-gate:before {
content: "\f6a1";
}
.fa-vihara:before {
content: "\f6a7";
}
.fa-volume-mute:before {
content: "\f6a9";
}
.fa-yin-yang:before {
content: "\f6ad";
}
.fa-blender-phone:before {
content: "\f6b6";
}
.fa-book-dead:before {
content: "\f6b7";
}
.fa-campground:before {
content: "\f6bb";
}
.fa-cat:before {
content: "\f6be";
}
.fa-chair:before {
content: "\f6c0";
}
.fa-cloud-moon:before {
content: "\f6c3";
}
.fa-cloud-sun:before {
content: "\f6c4";
}
.fa-dice-d20:before {
content: "\f6cf";
}
.fa-dice-d6:before {
content: "\f6d1";
}
.fa-dog:before {
content: "\f6d3";
}
.fa-dragon:before {
content: "\f6d5";
}
.fa-drumstick-bite:before {
content: "\f6d7";
}
.fa-dungeon:before {
content: "\f6d9";
}
.fa-file-csv:before {
content: "\f6dd";
}
.fa-fist-raised:before {
content: "\f6de";
}
.fa-ghost:before {
content: "\f6e2";
}
.fa-hammer:before {
content: "\f6e3";
}
.fa-hanukiah:before {
content: "\f6e6";
}
.fa-hat-wizard:before {
content: "\f6e8";
}
.fa-hiking:before {
content: "\f6ec";
}
.fa-hippo:before {
content: "\f6ed";
}
.fa-horse:before {
content: "\f6f0";
}
.fa-house-damage:before {
content: "\f6f1";
}
.fa-hryvnia:before {
content: "\f6f2";
}
.fa-mask:before {
content: "\f6fa";
}
.fa-mountain:before {
content: "\f6fc";
}
.fa-network-wired:before {
content: "\f6ff";
}
.fa-otter:before {
content: "\f700";
}
.fa-ring:before {
content: "\f70b";
}
.fa-running:before {
content: "\f70c";
}
.fa-scroll:before {
content: "\f70e";
}
.fa-skull-crossbones:before {
content: "\f714";
}
.fa-slash:before {
content: "\f715";
}
.fa-spider:before {
content: "\f717";
}
.fa-toilet-paper:before {
content: "\f71e";
}
.fa-tractor:before {
content: "\f722";
}
.fa-user-injured:before {
content: "\f728";
}
.fa-vr-cardboard:before {
content: "\f729";
}
.fa-wind:before {
content: "\f72e";
}
.fa-wine-bottle:before {
content: "\f72f";
}
.fa-cloud-meatball:before {
content: "\f73b";
}
.fa-cloud-moon-rain:before {
content: "\f73c";
}
.fa-cloud-rain:before {
content: "\f73d";
}
.fa-cloud-showers-heavy:before {
content: "\f740";
}
.fa-cloud-sun-rain:before {
content: "\f743";
}
.fa-democrat:before {
content: "\f747";
}
.fa-flag-usa:before {
content: "\f74d";
}
.fa-meteor:before {
content: "\f753";
}
.fa-person-booth:before {
content: "\f756";
}
.fa-poo-storm:before {
content: "\f75a";
}
.fa-rainbow:before {
content: "\f75b";
}
.fa-republican:before {
content: "\f75e";
}
.fa-smog:before {
content: "\f75f";
}
.fa-temperature-high:before {
content: "\f769";
}
.fa-temperature-low:before {
content: "\f76b";
}
.fa-vote-yea:before {
content: "\f772";
}
.fa-water:before {
content: "\f773";
}
.fa-baby:before {
content: "\f77c";
}
.fa-baby-carriage:before {
content: "\f77d";
}
.fa-biohazard:before {
content: "\f780";
}
.fa-blog:before {
content: "\f781";
}
.fa-calendar-day:before {
content: "\f783";
}
.fa-calendar-week:before {
content: "\f784";
}
.fa-candy-cane:before {
content: "\f786";
}
.fa-carrot:before {
content: "\f787";
}
.fa-cash-register:before {
content: "\f788";
}
.fa-compress-arrows-alt:before {
content: "\f78c";
}
.fa-dumpster:before {
content: "\f793";
}
.fa-dumpster-fire:before {
content: "\f794";
}
.fa-ethernet:before {
content: "\f796";
}
.fa-gifts:before {
content: "\f79c";
}
.fa-glass-cheers:before {
content: "\f79f";
}
.fa-glass-whiskey:before {
content: "\f7a0";
}
.fa-globe-europe:before {
content: "\f7a2";
}
.fa-grip-lines:before {
content: "\f7a4";
}
.fa-grip-lines-vertical:before {
content: "\f7a5";
}
.fa-guitar:before {
content: "\f7a6";
}
.fa-heart-broken:before {
content: "\f7a9";
}
.fa-holly-berry:before {
content: "\f7aa";
}
.fa-horse-head:before {
content: "\f7ab";
}
.fa-icicles:before {
content: "\f7ad";
}
.fa-igloo:before {
content: "\f7ae";
}
.fa-mitten:before {
content: "\f7b5";
}
.fa-mug-hot:before {
content: "\f7b6";
}
.fa-radiation:before {
content: "\f7b9";
}
.fa-radiation-alt:before {
content: "\f7ba";
}
.fa-restroom:before {
content: "\f7bd";
}
.fa-satellite:before {
content: "\f7bf";
}
.fa-satellite-dish:before {
content: "\f7c0";
}
.fa-sd-card:before {
content: "\f7c2";
}
.fa-sim-card:before {
content: "\f7c4";
}
.fa-skating:before {
content: "\f7c5";
}
.fa-skiing:before {
content: "\f7c9";
}
.fa-skiing-nordic:before {
content: "\f7ca";
}
.fa-sleigh:before {
content: "\f7cc";
}
.fa-sms:before {
content: "\f7cd";
}
.fa-snowboarding:before {
content: "\f7ce";
}
.fa-snowman:before {
content: "\f7d0";
}
.fa-snowplow:before {
content: "\f7d2";
}
.fa-tenge:before {
content: "\f7d7";
}
.fa-toilet:before {
content: "\f7d8";
}
.fa-tools:before {
content: "\f7d9";
}
.fa-tram:before {
content: "\f7da";
}
.fa-fire-alt:before {
content: "\f7e4";
}
.fa-bacon:before {
content: "\f7e5";
}
.fa-book-medical:before {
content: "\f7e6";
}
.fa-bread-slice:before {
content: "\f7ec";
}
.fa-cheese:before {
content: "\f7ef";
}
.fa-clinic-medical:before {
content: "\f7f2";
}
.fa-comment-medical:before {
content: "\f7f5";
}
.fa-crutch:before {
content: "\f7f7";
}
.fa-disease:before {
content: "\f7fa";
}
.fa-egg:before {
content: "\f7fb";
}
.fa-hamburger:before {
content: "\f805";
}
.fa-hand-middle-finger:before {
content: "\f806";
}
.fa-hard-hat:before {
content: "\f807";
}
.fa-hospital-user:before {
content: "\f80d";
}
.fa-hotdog:before {
content: "\f80f";
}
.fa-ice-cream:before {
content: "\f810";
}
.fa-laptop-medical:before {
content: "\f812";
}
.fa-pager:before {
content: "\f815";
}
.fa-pepper-hot:before {
content: "\f816";
}
.fa-pizza-slice:before {
content: "\f818";
}
.fa-trash-restore:before {
content: "\f829";
}
.fa-trash-restore-alt:before {
content: "\f82a";
}
.fa-user-nurse:before {
content: "\f82f";
}
.fa-wave-square:before {
content: "\f83e";
}
.fa-biking:before {
content: "\f84a";
}
.fa-border-all:before {
content: "\f84c";
}
.fa-border-none:before {
content: "\f850";
}
.fa-border-style:before {
content: "\f853";
}
.fa-fan:before {
content: "\f863";
}
.fa-icons:before {
content: "\f86d";
}
.fa-phone-alt:before {
content: "\f879";
}
.fa-phone-square-alt:before {
content: "\f87b";
}
.fa-photo-video:before {
content: "\f87c";
}
.fa-remove-format:before {
content: "\f87d";
}
.fa-sort-alpha-down-alt:before {
content: "\f881";
}
.fa-sort-alpha-up-alt:before {
content: "\f882";
}
.fa-sort-amount-down-alt:before {
content: "\f884";
}
.fa-sort-amount-up-alt:before {
content: "\f885";
}
.fa-sort-numeric-down-alt:before {
content: "\f886";
}
.fa-sort-numeric-up-alt:before {
content: "\f887";
}
.fa-spell-check:before {
content: "\f891";
}
.fa-voicemail:before {
content: "\f897";
}
.fa-hat-cowboy:before {
content: "\f8c0";
}
.fa-hat-cowboy-side:before {
content: "\f8c1";
}
.fa-mouse:before {
content: "\f8cc";
}
.fa-record-vinyl:before {
content: "\f8d9";
}
.fa-caravan:before {
content: "\f8ff";
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="icomoon" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="directions_bus" d="M768 468.667v214h-512v-214h512zM704 212.667q28 0 46 19t18 45-18 45-46 19-46-19-18-45 18-45 46-19zM320 212.667q28 0 46 19t18 45-18 45-46 19-46-19-18-45 18-45 46-19zM170 256.667v426q0 102 88 136t254 34 254-34 88-136v-426q0-56-44-96v-76q0-18-12-30t-30-12h-42q-18 0-31 12t-13 30v44h-340v-44q0-18-13-30t-31-12h-42q-18 0-30 12t-12 30v76q-44 40-44 96z" />
<glyph unicode="&#xe901;" glyph-name="bus" horiz-adv-x="1056" d="M704 31.616c0-17.696 14.304-32 32-32h32c17.664 0 32 14.304 32 32v65.984h-96v-65.984zM256 31.616c0-17.696 14.304-32 32-32h32c17.696 0 32 14.304 32 32v65.984h-96v-65.984zM159.52 136.672c0-21.44 17.408-38.88 38.88-38.88h659.072c21.472 0 38.88 17.44 38.88 38.88 0 21.504 0 22.88 0 22.88h-736.832c0 0 0-1.376 0-22.88zM1024 639.616v64h-127.68l0.032 34.816c0 77.792-79.648 157.984-383.168 157.984-266.816 0-353.664-80.192-353.664-157.984v-34.816h-127.52v-64h-32v-128h32v-64h127.52v-255.168h736l0.704 479.168h95.776v-32h-32v-128h32v-32h-96v-32h128v64h32v128h-32zM159.52 479.616h-95.52v32h32v128h-32v32h95.52v-192zM400 801.6h256c8.832 0 16-7.168 16-16s-7.168-16-16-16h-256c-8.832 0-16 7.168-16 16s7.168 16 16 16zM225.312 664.672c0 21.472 17.408 38.88 38.88 38.88h208.448c21.472 0 38.88-17.408 38.88-38.88v-114.656c0-21.504-17.408-38.912-38.88-38.912h-208.448c-21.472 0-38.88 17.408-38.88 38.912v114.656zM287.616 264.384c-32.224 0-58.304 26.112-58.304 58.304 0 32.256 26.080 58.304 58.304 58.304s58.336-26.048 58.336-58.304c0.032-32.192-26.112-58.304-58.336-58.304zM384 415.616h288v-32h-288v32zM673.024 257.824h-288.192v30.88h288.192v-30.88zM673.024 321.568h-288.192v30.88h288.192v-30.88zM768.256 262.368c-32.224 0-58.304 26.112-58.304 58.304s26.080 58.304 58.304 58.304 58.336-26.112 58.336-58.304-26.112-58.304-58.336-58.304zM832.16 550.016c0-21.504-17.408-38.912-38.912-38.912h-209.984c-21.504 0-38.912 17.408-38.912 38.912v114.656c0 21.472 17.408 38.88 38.912 38.88h209.984c21.504 0 38.912-17.408 38.912-38.88v-114.656z" />
<glyph unicode="&#xe902;" glyph-name="travel-bus" d="M665.6 51.2h-307.2v-51.2c0-28.277-22.923-51.2-51.2-51.2v0h-51.2c-28.277 0-51.2 22.923-51.2 51.2v0 51.2c-56.554 0-102.4 45.846-102.4 102.4v0 716.8c0 56.32 46.080 102.4 102.4 102.4h614.4c56.554 0 102.4-45.846 102.4-102.4v0-716.8c0-56.554-45.846-102.4-102.4-102.4v0-51.2c0-28.277-22.923-51.2-51.2-51.2v0h-51.2c-28.277 0-51.2 22.923-51.2 51.2v0 51.2zM204.8 716.8v-307.2h256v307.2h-256zM563.2 716.8v-307.2h256v307.2h-256zM256 870.4v-51.2h512v51.2h-512zM281.6 153.6c42.415 0 76.8 34.385 76.8 76.8s-34.385 76.8-76.8 76.8v0c-42.415 0-76.8-34.385-76.8-76.8s34.385-76.8 76.8-76.8v0zM742.4 153.6c42.415 0 76.8 34.385 76.8 76.8s-34.385 76.8-76.8 76.8v0c-42.415 0-76.8-34.385-76.8-76.8s34.385-76.8 76.8-76.8v0z" />
<glyph unicode="&#xe903;" glyph-name="plane" d="M496.672 834.88c26.496 0 48-21.504 48-48v-248l320-200v-86.016l-320 108v-168l65.248-64.928-0.032-66.688-113.216 37.632-111.584-37.76 0.48 70.048 61.12 59.68 0.544 169.984-319.904-109.952 0.672 88 320.224 202.016 0.512 246.016c-0.064 26.464 21.44 47.968 47.936 47.968z" />
<glyph unicode="&#xe905;" glyph-name="shopping-cart1" d="M469.333 42.667c0 23.552-9.6 44.928-25.003 60.331s-36.779 25.003-60.331 25.003-44.928-9.6-60.331-25.003-25.003-36.779-25.003-60.331 9.6-44.928 25.003-60.331 36.779-25.003 60.331-25.003 44.928 9.6 60.331 25.003 25.003 36.779 25.003 60.331zM938.667 42.667c0 23.552-9.6 44.928-25.003 60.331s-36.779 25.003-60.331 25.003-44.928-9.6-60.331-25.003-25.003-36.779-25.003-60.331 9.6-44.928 25.003-60.331 36.779-25.003 60.331-25.003 44.928 9.6 60.331 25.003 25.003 36.779 25.003 60.331zM308.096 640h621.653l-58.496-306.816c-1.963-9.728-7.083-18.133-14.165-24.235-7.68-6.656-17.621-10.496-29.355-10.283h-415.317c-9.899-0.128-19.243 3.029-26.709 8.661-8.107 6.101-14.037 14.976-16.171 25.728zM42.667 853.334h135.68l36.181-180.864c4.608-18.645 21.419-32.469 41.472-32.469h52.096l-17.067 85.333h-35.029c-23.552 0-42.667-19.115-42.667-42.667 0-2.261 0.171-4.48 0.512-6.613 0.171-1.195 0.427-2.432 0.725-3.584l71.296-356.139c6.357-32.043 24.277-59.008 48.64-77.269 22.229-16.725 49.92-26.155 79.104-25.728h414.123c31.915-0.64 62.080 11.136 85.12 31.019 21.077 18.176 36.181 43.221 42.027 71.808l68.352 358.485c4.395 23.168-10.752 45.483-33.92 49.92-2.773 0.555-5.547 0.811-7.979 0.768h-690.347l-35.84 179.029c-4.011 19.712-21.205 34.304-41.813 34.304h-170.667c-23.552 0-42.667-19.115-42.667-42.667s19.115-42.667 42.667-42.667z" />
<glyph unicode="&#xe906;" glyph-name="directions_bus1" d="M768 468.667v214h-512v-214h512zM704 212.667q28 0 46 19t18 45-18 45-46 19-46-19-18-45 18-45 46-19zM320 212.667q28 0 46 19t18 45-18 45-46 19-46-19-18-45 18-45 46-19zM170 256.667v426q0 102 88 136t254 34 254-34 88-136v-426q0-56-44-96v-76q0-18-12-30t-30-12h-42q-18 0-31 12t-13 30v44h-340v-44q0-18-13-30t-31-12h-42q-18 0-30 12t-12 30v76q-44 40-44 96z" />
<glyph unicode="&#xe907;" glyph-name="currency-dollar" d="M512-51.2c-282.77 0-512 229.23-512 512s229.23 512 512 512v0c282.77 0 512-229.23 512-512s-229.23-512-512-512v0zM563.2 204.8h51.2c84.831 0 153.6 68.769 153.6 153.6s-68.769 153.6-153.6 153.6v0h-205.312c-28.277 0-51.2 22.923-51.2 51.2s22.923 51.2 51.2 51.2v0h307.712v102.4h-153.6v102.4h-102.4v-102.4h-51.2c-84.831 0-153.6-68.769-153.6-153.6s68.769-153.6 153.6-153.6v0h204.8c28.277 0 51.2-22.923 51.2-51.2s-22.923-51.2-51.2-51.2v0h-307.2v-102.4h153.6v-102.4h102.4v102.4z" />
<glyph unicode="&#xf07a;" glyph-name="shopping-cart" horiz-adv-x="951" d="M365.714 73.143c0-40-33.143-73.143-73.143-73.143s-73.143 33.143-73.143 73.143 33.143 73.143 73.143 73.143 73.143-33.143 73.143-73.143zM877.714 73.143c0-40-33.143-73.143-73.143-73.143s-73.143 33.143-73.143 73.143 33.143 73.143 73.143 73.143 73.143-33.143 73.143-73.143zM950.857 694.857v-292.571c0-18.286-14.286-34.286-32.571-36.571l-596.571-69.714c2.857-13.143 7.429-26.286 7.429-40 0-13.143-8-25.143-13.714-36.571h525.714c20 0 36.571-16.571 36.571-36.571s-16.571-36.571-36.571-36.571h-585.143c-20 0-36.571 16.571-36.571 36.571 0 17.714 25.714 60.571 34.857 78.286l-101.143 470.286h-116.571c-20 0-36.571 16.571-36.571 36.571s16.571 36.571 36.571 36.571h146.286c38.286 0 39.429-45.714 45.143-73.143h686.286c20 0 36.571-16.571 36.571-36.571z" />
<glyph unicode="&#xf155;" glyph-name="dollar, usd" horiz-adv-x="583" d="M558.857 273.714c0-116.571-83.429-208.571-204.571-228.571v-100c0-10.286-8-18.286-18.286-18.286h-77.143c-9.714 0-18.286 8-18.286 18.286v100c-133.714 18.857-206.857 98.857-209.714 102.286-5.714 6.857-6.286 16.571-1.143 23.429l58.857 77.143c2.857 4 8 6.286 13.143 6.857s10.286-1.143 13.714-5.143c1.143-0.571 81.143-77.143 182.286-77.143 56 0 116.571 29.714 116.571 94.286 0 54.857-67.429 81.714-144.571 112.571-102.857 40.571-230.857 92-230.857 235.429 0 105.143 82.286 192 201.714 214.857v102.857c0 10.286 8.571 18.286 18.286 18.286h77.143c10.286 0 18.286-8 18.286-18.286v-100.571c116-13.143 177.714-76 180-78.286 5.714-6.286 6.857-14.857 2.857-21.714l-46.286-83.429c-2.857-5.143-7.429-8.571-13.143-9.143-5.714-1.143-10.857 0.571-15.429 4-0.571 0.571-69.714 61.714-155.429 61.714-72.571 0-122.857-36-122.857-88 0-60.571 69.714-87.429 150.857-118.857 105.143-40.571 224-86.857 224-224.571z" />
<glyph unicode="&#xf207;" glyph-name="bus1" horiz-adv-x="878" d="M219.429 256c0 40.571-32.571 73.143-73.143 73.143s-73.143-32.571-73.143-73.143 32.571-73.143 73.143-73.143 73.143 32.571 73.143 73.143zM804.571 256c0 40.571-32.571 73.143-73.143 73.143s-73.143-32.571-73.143-73.143 32.571-73.143 73.143-73.143 73.143 32.571 73.143 73.143zM778.286 482.286l-41.143 219.429c-3.429 17.143-18.286 29.714-36 29.714h-524.571c-17.714 0-32.571-12.571-36-29.714l-41.143-219.429c-4-22.857 13.143-43.429 36-43.429h606.857c22.857 0 40 20.571 36 43.429zM649.143 832c0 15.429-12 27.429-27.429 27.429h-365.714c-14.857 0-27.429-12-27.429-27.429s12.571-27.429 27.429-27.429h365.714c15.429 0 27.429 12 27.429 27.429zM877.714 417.714v-344.571h-73.143v-73.143c0-40.571-32.571-73.143-73.143-73.143s-73.143 32.571-73.143 73.143v73.143h-438.857v-73.143c0-40.571-32.571-73.143-73.143-73.143s-73.143 32.571-73.143 73.143v73.143h-73.143v344.571c0 46.857 4 81.714 14.286 127.429l58.857 259.429c10.857 91.429 170.857 146.286 365.714 146.286s354.857-54.857 365.714-146.286l60-259.429c10.286-45.714 13.143-80.571 13.143-127.429z" />
</font></defs></svg>
\ No newline at end of file
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?rn7mqw');
src: url('fonts/icomoon.eot?rn7mqw#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?rn7mqw') format('truetype'),
url('fonts/icomoon.woff?rn7mqw') format('woff'),
url('fonts/icomoon.svg?rn7mqw#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="fa-"], [class*=" fa-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa-shopping-cart1:before {
content: "\e905";
}
.fa-directions_bus1:before {
content: "\e906";
}
.fa-directions_bus:before {
content: "\e900";
}
.fa-bus:before {
content: "\e901";
}
.fa-plane:before {
content: "\e903";
}
.fa-shopping-cart:before {
content: "\f07a";
}
.fa-dollar:before {
content: "\f155";
}
.fa-usd:before {
content: "\f155";
}
.fa-bus1:before {
content: "\f207";
}
.fa-currency-dollar:before {
content: "\e907";
}
.fa-travel-bus:before {
content: "\e902";
}
:root {
--main-bg-color: #262626;
--main-text-color: #b2b2b2;
--main-bg-color:#262626;
--main-text-color:#b2b2b2;
--cell-bg-color:#333;
}
*{
......@@ -15,6 +16,10 @@ body {
color:#333;
font-family:sans-serif;
background-color: var(--main-bg-color);
/*line-height: 1.5;
font: 12px sans-serif;
/*color: var(--main-text-color);
background-color: var(--cell-bg-color);*/
}
.img_bg{
......@@ -194,6 +199,12 @@ body {
/*text-transform: capitalize;*/
}
.legendItem {
top: -25%;
position: relative;
padding-left: 10px;
}
/* Footer */
img.grayscale {
filter: gray; /* IE6-9 */
......@@ -231,101 +242,39 @@ span.frac > span {
display: none;
}
/******
Icons
******/
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?woqphe');
src: url('fonts/icomoon.eot?woqphe#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?woqphe') format('truetype'),
url('fonts/icomoon.woff?woqphe') format('woff'),
url('fonts/icomoon.svg?woqphe#icomoon') format('svg');
font-weight: normal;
font-style: normal;
#tblViajes {
display: none;
font: 12px sans-serif;
}
[class^="fa-"], [class*=" fa-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/*.table-fixed thead {
width: 100%;
}
.fa-casetapeaje:before {
content: "\e900";
}
.fa-desechos:before {
content: "\e901";
}
.fa-escuela:before {
content: "\e902";
}
.fa-presa:before {
content: "\e905";
}
.fa-puente:before {
content: "\e906";
}
.fa-puertoindustrial:before {
content: "\e907";
/* color: #fff; */
color: #000;
background-color: #F5F5F3;
}
.fa-puntofronterizo:before {
content: "\e908";
}
.fa-spinner:before {
content: "\e97a";
}
.fa-spinner2:before {
content: "\e97b";
}
.fa-spinner3:before {
content: "\e97c";
}
.fa-spinner4:before {
content: "\e97d";
}
.fa-spinner5:before {
content: "\e97e";
}
.fa-spinner6:before {
content: "\e97f";
}
.fa-spinner7:before {
content: "\e980";
}
.fa-spinner8:before {
content: "\e981";
}
.fa-spinner9:before {
content: "\e982";
}
.fa-spinner10:before {
content: "\e983";
}
.fa-plus-circle:before {
content: "\f055";
}
.fa-bed:before {
content: "\f236";
.table-fixed tbody {
height:-webkit-calc(100% - 45px);
height:-moz-calc(100% - 45px);
height:calc(100% - 45px);
overflow-y: auto;
position: absolute;
}
.fa-hotel:before {
content: "\f236";
.table-fixed tr {
width:100%;
display: inline-table;
table-layout: fixed;
}
/* FIX: if scrollbar is hidden, tr goes beyond padding...
/*.table-fixed tr:has([overflow-y]) + .table-fixed tr {width:calc(100% - 15px);}
/* Graphs */
.amcharttooltip {
font: 12px sans-serif;
}
.active {
text-decoration: underline;
font-weight: 600;
......@@ -380,7 +329,7 @@ Icons
.tooltip {
position: absolute;
bottom: 50%; /* so it is not added below the map and scroll bars appear */
/*bottom: 50%; /* so it is not added below the map and scroll bars appear */
/*width: 120px;
height: 20px;*/
z-index: 1001;
......
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<meta charset="utf-8" />
<title>Contenido de agua en la cuenca Grijalva</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" />
<link rel="stylesheet" href="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.control.min.css" />
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css' rel='stylesheet' />
<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css"
integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="../js/L.VisualClick/L.VisualClick.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css" />
<link rel="stylesheet" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css">
<link rel="stylesheet" href="../js/L.VisualClick/L.VisualClick.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css" />
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="../css/fontawesome.css" />
<link rel="icon" href="../img/grijalva.png" sizes="16x16">
</head>
<body>
<div id="initial-backdrop">
<img class="img_bg" src="../img/sumidero2.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
......@@ -136,23 +135,21 @@
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"></script>
<script src="../js/Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.js"></script>
<script src="../js/L.VisualClick/L.VisualClick.js"></script>
<script src="https://api.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.3.1/leaflet-omnivore.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/2.0.3/chroma.min.js"></script>
<script src="https://d3js.org/d3.v5.min.js"></script>
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js'></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js"></script>
<script src="https://unpkg.com/mapbox-gl-leaflet/leaflet-mapbox-gl.js"></script>
<script type="text/javascript" src="../js/Leaflet.Sync.js"></script>
<script src="../js/Leaflet.Sync.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script type="text/javascript" src="../js/jszip.min.js"></script>
<script src="../js/jszip.min.js"></script>
<script src="../js/grijalva_functions.js"></script>
<script src="../js/grijalva_basemap.js"></script>
<script src="../js/grijalva_charts.js"></script>
......
......@@ -6,10 +6,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Proyecto FORDECyT 2018 - 10</title>
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/cover_style.css">
<link rel="stylesheet" href="css/cover_style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
<link rel="icon" href="img/monitoreo.png" sizes="16x16">
</head>
......@@ -47,52 +45,53 @@
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="row">
<div class="card mb-4 shadow-sm">
<div class="card-header">
<h4 class="my-0 font-weight-normal">R&iacute;o Grijalva</h4>
</div>
<div class="card-body">
<div class="hovereffect zoom">
<img class="card-img" src="img/sumidero.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<span class="photo-credit">Foto: Gabriela L&oacute;pez</span>
<div class="overlay">
<a class="info" href="grijalva/">
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar
sitio</span>
<br><br>
</a>
<div class="row no-gutters">
<div class="col-sm-6">
<div class="card mb-4 shadow-sm">
<div class="card-header">
<h4 class="my-0 font-weight-normal">R&iacute;o Grijalva</h4>
</div>
<div class="card-body">
<div class="hovereffect zoom">
<img class="card-img" src="img/sumidero.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<span class="photo-credit">Foto: Gabriela L&oacute;pez</span>
<div class="overlay">
<a class="info" href="grijalva/">
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="100%">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar sitio</span>
<br><br>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="card mb-4 shadow-sm">
<span class="github-fork-ribbon left-bottom" data-ribbon="En construcción" title="En construcción">En construcción</span>
<div class="card-header">
<h4 class="my-0 font-weight-normal">Riesgo</h4>
</div>
<div class="card-body">
<div class="hovereffect zoom">
<img class="card-img" src="img/inundacion.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<span class="photo-credit">Foto: Felinto C&oacute;rdoba</span>
<div class="overlay">
<a class="info" href="riesgos/">
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar
sitio</span>
<br><br>
</a>
<div class="col-sm-6">
<div class="card mb-4 shadow-sm">
<span class="github-fork-ribbon left-bottom" data-ribbon="En construcción" title="En construcción">En construcción</span>
<div class="card-header">
<h4 class="my-0 font-weight-normal">Riesgo</h4>
</div>
<div class="card-body">
<div class="hovereffect zoom">
<img class="card-img" src="img/inundacion.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<span class="photo-credit">Foto: Felinto C&oacute;rdoba</span>
<div class="overlay">
<a class="info" href="riesgos/">
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="100%">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar sitio</span>
<br><br>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row justify-content-md-center">
<div class="col-6">
<div class="row no-gutters justify-content-md-center">
<div class="col-sm-6">
<div class="card mb-4 shadow-sm">
<span class="github-fork-ribbon left-bottom" data-ribbon="En construcción" title="En construcción">En construcción</span>
<div class="card-header">
......@@ -104,16 +103,14 @@
<span class="photo-credit">Foto: Lucy Nieto</span>
<div class="overlay">
<a class="info" href="centropais/">
<img class="hoverimg mx-auto d-block" src="img/cmcp.png" width="325px">
<span class="btn btn-primary hoverbtn" href="centropais/" role="button">Visitar
sitio</span>
<img class="hoverimg mx-auto d-block" src="img/cmcp.png" width="100%">
<span class="btn btn-primary hoverbtn" href="centropais/" role="button">Visitar sitio</span>
<br><br>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
......
(function(factory, window) {
// module loaders support for LeafletJS plugins, see:
// https://github.com/Leaflet/Leaflet/blob/master/PLUGIN-GUIDE.md#module-loaders
// AMD module that relies on "leaflet"
if (typeof define === 'function' && define.amd) {
define(['leaflet'], factory);
// Common JS module that relies on "leaflet"
} else if (typeof exports === 'object') {
module.exports = factory(require('leaflet'));
}
// attach plugin to the global leaflet "L" variable
if (typeof window !== 'undefined' && window.L) {
window.L.CanvasFlowmapLayer = factory(L);
window.L.canvasFlowmapLayer = function(originAndDestinationGeoJsonPoints, opts) {
return new window.L.CanvasFlowmapLayer(originAndDestinationGeoJsonPoints, opts);
};
}
}(function(L) {
// layer source code
var canvasRenderer = L.canvas();
var CanvasFlowmapLayer = L.GeoJSON.extend({
options: {
// this is only a default option example,
// developers will most likely need to provide this
// options object with values unique to their data
originAndDestinationFieldIds: {
originUniqueIdField: 'origin_id',
originGeometry: {
x: 'origin_lon',
y: 'origin_lat'
},
destinationUniqueIdField: 'destination_id',
destinationGeometry: {
x: 'destination_lon',
y: 'destination_lat'
}
},
canvasBezierStyle: {
type: 'simple',
symbol: {
// use canvas styling options (compare to CircleMarker styling below)
strokeStyle: 'rgba(255, 0, 51, 0.8)',
lineWidth: 0.75,
lineCap: 'round',
shadowColor: 'rgb(255, 0, 51)',
shadowBlur: 1.5
}
},
animatedCanvasBezierStyle: {
type: 'simple',
symbol: {
// use canvas styling options (compare to CircleMarker styling below)
strokeStyle: 'rgb(255, 46, 88)',
lineWidth: 1.25,
lineDashOffsetSize: 4, // custom property used with animation sprite sizes
lineCap: 'round',
shadowColor: 'rgb(255, 0, 51)',
shadowBlur: 2
}
},
// valid values: 'selection' or 'all'
// use 'all' to display all Bezier paths immediately
// use 'selection' if Bezier paths will be drawn with user interactions
pathDisplayMode: 'all',
wrapAroundCanvas: true,
animationStarted: false,
animationEasingFamily: 'Cubic',
animationEasingType: 'In',
animationDuration: 2000,
pointToLayer: function(geoJsonPoint, latlng) {
return L.circleMarker(latlng);
},
style: function(geoJsonFeature) {
// use leaflet's path styling options
// since the GeoJSON feature properties are modified by the layer,
// developers can rely on the "isOrigin" property to set different
// symbols for origin vs destination CircleMarker stylings
if (geoJsonFeature.properties.isOrigin) {
return {
renderer: canvasRenderer, // recommended to use L.canvas()
radius: 5,
weight: 1,
color: 'rgb(195, 255, 62)',
fillColor: 'rgba(195, 255, 62, 0.6)',
fillOpacity: 0.6
};
} else {
return {
renderer: canvasRenderer,
radius: 2.5,
weight: 0.25,
color: 'rgb(17, 142, 170)',
fillColor: 'rgb(17, 142, 170)',
fillOpacity: 0.7
};
}
}
},
_customCanvases: [],
initialize: function(geoJson, options) {
// same as L.GeoJSON intialize method, but first performs custom GeoJSON
// data parsing and reformatting before finally calling L.GeoJSON addData method
L.setOptions(this, options);
this._animationPropertiesStatic = {
offset: 0,
resetOffset: 200,
repeat: Infinity,
yoyo: false
};
this._animationPropertiesDynamic = {
duration: null,
easingInfo: null
};
this._layers = {};
// beginning of customized initialize method
if (geoJson && this.options.originAndDestinationFieldIds) {
this.setOriginAndDestinationGeoJsonPoints(geoJson);
}
// establish animation properties using Tween.js library
// currently requires the developer to add it to their own app index.html
// TODO: find better way to wrap it up in this layer source code
if (window.hasOwnProperty('TWEEN')) {
// set this._animationPropertiesDynamic.duration value
this.setAnimationDuration(this.options.animationDuration);
// set this._animationPropertiesDynamic.easingInfo value
this.setAnimationEasing(this.options.animationEasingFamily, this.options.animationEasingType);
// initiate the active animation tween
this._animationTween = new TWEEN.Tween(this._animationPropertiesStatic)
.to({
offset: this._animationPropertiesStatic.resetOffset
}, this._animationPropertiesDynamic.duration)
.easing(this._animationPropertiesDynamic.easingInfo.tweenEasingFunction)
.repeat(this._animationPropertiesStatic.repeat)
.yoyo(this._animationPropertiesStatic.yoyo)
.start();
} else {
// Tween.js lib isn't available,
// ensure that animations aren't attempted at the beginning
this.options.animationStarted = false;
}
},
setOriginAndDestinationGeoJsonPoints: function(geoJsonFeatureCollection) {
if (geoJsonFeatureCollection.features) {
var configOriginGeometryObject = this.options.originAndDestinationFieldIds.originGeometry;
var configDestinationGeometryObject = this.options.originAndDestinationFieldIds.destinationGeometry;
geoJsonFeatureCollection.features.forEach(function(feature, index) {
if (feature.type === 'Feature' && feature.geometry && feature.geometry.type === 'Point') {
// origin feature -- modify attribute properties and geometry
feature.properties.isOrigin = true;
feature.properties._isSelectedForPathDisplay = this.options.pathDisplayMode === 'all' ? true : false;
feature.properties._uniqueId = index + '_origin';
feature.geometry.coordinates = [
feature.properties[configOriginGeometryObject.x],
feature.properties[configOriginGeometryObject.y]
];
// destination feature -- clone, modify, and push to feature collection
var destinationFeature = JSON.parse(JSON.stringify(feature));
destinationFeature.properties.isOrigin = false;
destinationFeature.properties._isSelectedForPathDisplay = false;
destinationFeature.properties._uniqueId = index + '_destination';
destinationFeature.geometry.coordinates = [
destinationFeature.properties[configDestinationGeometryObject.x],
destinationFeature.properties[configDestinationGeometryObject.y]
];
geoJsonFeatureCollection.features.push(destinationFeature);
}
}, this);
// all origin/destination features are available for future internal used
// but only a filtered subset of these are drawn on the map
this.originAndDestinationGeoJsonPoints = geoJsonFeatureCollection;
var geoJsonPointsToDraw = this._filterGeoJsonPointsToDraw(geoJsonFeatureCollection);
this.addData(geoJsonPointsToDraw);
} else {
// TODO: improved handling of invalid incoming GeoJson FeatureCollection?
this.originAndDestinationGeoJsonPoints = null;
}
return this;
},
onAdd: function(map) {
// call the L.GeoJSON onAdd method,
// then continue with custom code
L.GeoJSON.prototype.onAdd.call(this, map);
// create new canvas element for optional, animated bezier curves
this._animationCanvasElement = this._insertCustomCanvasElement(map, this.options);
// create new canvas element for manually drawing bezier curves
// - most of the magic happens in this canvas element
// - this canvas element is established last because it will be
// inserted before (underneath) the animation canvas element
this._canvasElement = this._insertCustomCanvasElement(map, this.options);
// create a reference to both canvas elements in an array for convenience
this._customCanvases = [this._canvasElement, this._animationCanvasElement]
// establish custom event listeners
this.on('click mouseover', this._modifyInteractionEvent, this);
map.on('move', this._resetCanvas, this);
map.on('moveend', this._resetCanvasAndWrapGeoJsonCircleMarkers, this);
map.on('resize', this._resizeCanvas, this);
if (map.options.zoomAnimation && L.Browser.any3d) {
map.on('zoomanim', this._animateZoom, this);
}
// calculate initial size and position of canvas
// and draw its content for the first time
this._resizeCanvas();
this._resetCanvasAndWrapGeoJsonCircleMarkers();
return this;
},
onRemove: function(map) {
// call the L.GeoJSON onRemove method,
// then continue with custom code
L.GeoJSON.prototype.onRemove.call(this, map);
this._clearCanvas();
this._customCanvases.forEach(function(canvas) {
L.DomUtil.remove(canvas);
});
// remove custom event listeners
this.off('click mouseover', this._modifyInteractionEvent, this);
map.off('move', this._resetCanvas, this);
map.off('moveend', this._resetCanvasAndWrapGeoJsonCircleMarkers, this);
map.off('resize', this._resizeCanvas, this);
if (map.options.zoomAnimation) {
map.off('zoomanim', this._animateZoom, this);
}
return this;
},
bringToBack: function() {
// call the L.GeoJSON bringToBack method to manage the point graphics
L.GeoJSON.prototype.bringToBack.call(this);
// keep the animation canvas element on top of the main canvas element
L.DomUtil.toBack(this._animationCanvasElement);
// keep the main canvas element underneath the animation canvas element
L.DomUtil.toBack(this._canvasElement);
return this;
},
bringToFront: function() {
// keep the main canvas element underneath the animation canvas element
L.DomUtil.toFront(this._canvasElement);
// keep the animation canvas element on top of the main canvas element
L.DomUtil.toFront(this._animationCanvasElement);
// call the L.GeoJSON bringToFront method to manage the point graphics
L.GeoJSON.prototype.bringToFront.call(this);
return this;
},
setAnimationDuration: function(milliseconds) {
milliseconds = Number(milliseconds) || this.options.animationDuration;
// change the tween duration on the active animation tween
if (this._animationTween) {
this._animationTween.to({
offset: this._animationPropertiesStatic.resetOffset
}, milliseconds);
}
this._animationPropertiesDynamic.duration = milliseconds;
},
setAnimationEasing: function(easingFamily, easingType) {
var tweenEasingFunction;
if (
TWEEN.Easing.hasOwnProperty(easingFamily) &&
TWEEN.Easing[easingFamily].hasOwnProperty(easingType)
) {
tweenEasingFunction = TWEEN.Easing[easingFamily][easingType];
} else {
easingFamily = this.options.animationEasingFamily;
easingType = this.options.animationEasingType;
tweenEasingFunction = TWEEN.Easing[easingFamily][easingType];
}
// change the tween easing function on the active animation tween
if (this._animationTween) {
this._animationTween.easing(tweenEasingFunction);
}
this._animationPropertiesDynamic.easingInfo = {
easingFamily: easingFamily,
easingType: easingType,
tweenEasingFunction: tweenEasingFunction
};
},
getAnimationEasingOptions: function(prettyPrint) {
var tweenEasingConsoleOptions = {};
var tweenEasingOptions = {};
Object.keys(TWEEN.Easing).forEach(function(family) {
tweenEasingConsoleOptions[family] = {
types: Object.keys(TWEEN.Easing[family]).join('", "')
};
tweenEasingOptions[family] = {
types: Object.keys(TWEEN.Easing[family])
};
});
if (!!prettyPrint) {
console.table(tweenEasingConsoleOptions);
}
return tweenEasingOptions;
},
playAnimation: function() {
this.options.animationStarted = true;
this._redrawCanvas();
},
stopAnimation: function() {
this.options.animationStarted = false;
this._redrawCanvas();
},
selectFeaturesForPathDisplay: function(selectionFeatures, selectionMode) {
this._applyFeaturesSelection(selectionFeatures, selectionMode, '_isSelectedForPathDisplay');
},
selectFeaturesForPathDisplayById: function(uniqueOriginOrDestinationIdField, idValue, originBoolean, selectionMode) {
if (
uniqueOriginOrDestinationIdField !== this.options.originAndDestinationFieldIds.originUniqueIdField &&
uniqueOriginOrDestinationIdField !== this.options.originAndDestinationFieldIds.destinationUniqueIdField
) {
console.error('Invalid unique id field supplied for origin or destination. It must be one of these: ' +
this.options.originAndDestinationFieldIds.originUniqueIdField + ', ' + this.options.originAndDestinationFieldIds.destinationUniqueIdField);
return;
}
var existingOriginOrDestinationFeature = this.originAndDestinationGeoJsonPoints.features.filter(function(feature) {
return feature.properties.isOrigin === originBoolean &&
feature.properties[uniqueOriginOrDestinationIdField] === idValue;
})[0];
var odInfo = this._getSharedOriginOrDestinationFeatures(existingOriginOrDestinationFeature);
if (odInfo.isOriginFeature) {
this.selectFeaturesForPathDisplay(odInfo.sharedOriginFeatures, selectionMode);
} else {
this.selectFeaturesForPathDisplay(odInfo.sharedDestinationFeatures, selectionMode);
}
},
clearAllPathSelections: function() {
this.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
feature.properties._isSelectedForPathDisplay = false;
});
this._resetCanvas();
},
_filterGeoJsonPointsToDraw: function(geoJsonFeatureCollection) {
var newGeoJson = {
type: 'FeatureCollection',
features: []
};
var originUniqueIdValues = [];
var destinationUniqueIdValues = [];
var originUniqueIdField = this.options.originAndDestinationFieldIds.originUniqueIdField;
var destinationUniqueIdField = this.options.originAndDestinationFieldIds.destinationUniqueIdField;
geoJsonFeatureCollection.features.forEach(function(feature) {
var isOrigin = feature.properties.isOrigin;
if (isOrigin && originUniqueIdValues.indexOf(feature.properties[originUniqueIdField]) === -1) {
originUniqueIdValues.push(feature.properties[originUniqueIdField]);
newGeoJson.features.push(feature);
} else if (!isOrigin && destinationUniqueIdValues.indexOf(feature.properties[destinationUniqueIdField]) === -1) {
destinationUniqueIdValues.push(feature.properties[destinationUniqueIdField]);
newGeoJson.features.push(feature);
} else {
// do not attempt to draw an origin or destination circle on the canvas if it is already in one of the tracking arrays
return;
}
});
return newGeoJson;
},
_insertCustomCanvasElement: function(map, options) {
var canvas = L.DomUtil.create('canvas', 'leaflet-zoom-animated');
var originProp = L.DomUtil.testProp(['transformOrigin', 'WebkitTransformOrigin', 'msTransformOrigin']);
canvas.style[originProp] = '50% 50%';
var pane = map.getPane(options.pane);
pane.insertBefore(canvas, pane.firstChild);
return canvas;
},
_modifyInteractionEvent: function(e) {
var odInfo = this._getSharedOriginOrDestinationFeatures(e.layer.feature);
e.isOriginFeature = odInfo.isOriginFeature;
e.sharedOriginFeatures = odInfo.sharedOriginFeatures;
e.sharedDestinationFeatures = odInfo.sharedDestinationFeatures;
},
_getSharedOriginOrDestinationFeatures: function(testFeature) {
var isOriginFeature = testFeature.properties.isOrigin;
var sharedOriginFeatures = [];
var sharedDestinationFeatures = [];
if (isOriginFeature) {
// for an ORIGIN point that was interacted with,
// make an array of all other ORIGIN features with the same ORIGIN ID field
var originUniqueIdField = this.options.originAndDestinationFieldIds.originUniqueIdField;
var testFeatureOriginId = testFeature.properties[originUniqueIdField];
sharedOriginFeatures = this.originAndDestinationGeoJsonPoints.features.filter(function(feature) {
return feature.properties.isOrigin &&
feature.properties[originUniqueIdField] === testFeatureOriginId;
});
} else {
// for a DESTINATION point that was interacted with,
// make an array of all other ORIGIN features with the same DESTINATION ID field
var destinationUniqueIdField = this.options.originAndDestinationFieldIds.destinationUniqueIdField;
var testFeatureDestinationId = testFeature.properties[destinationUniqueIdField];
sharedDestinationFeatures = this.originAndDestinationGeoJsonPoints.features.filter(function(feature) {
return feature.properties.isOrigin &&
feature.properties[destinationUniqueIdField] === testFeatureDestinationId;
});
}
return {
isOriginFeature: isOriginFeature, // Boolean
sharedOriginFeatures: sharedOriginFeatures, // Array of features
sharedDestinationFeatures: sharedDestinationFeatures // Array of features
};
},
_applyFeaturesSelection: function(selectionFeatures, selectionMode, selectionAttributeName) {
var selectionIds = selectionFeatures.map(function(feature) {
return feature.properties._uniqueId;
});
if (selectionMode === 'SELECTION_NEW') {
this.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
if (selectionIds.indexOf(feature.properties._uniqueId) > -1) {
feature.properties[selectionAttributeName] = true;
} else {
feature.properties[selectionAttributeName] = false;
}
});
} else if (selectionMode === 'SELECTION_ADD') {
this.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
if (selectionIds.indexOf(feature.properties._uniqueId) > -1) {
feature.properties[selectionAttributeName] = true;
}
});
} else if (selectionMode === 'SELECTION_SUBTRACT') {
this.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
if (selectionIds.indexOf(feature.properties._uniqueId) > -1) {
feature.properties[selectionAttributeName] = false;
}
});
} else {
return;
}
this._resetCanvas();
},
_animateZoom: function(e) {
// see: https://github.com/Leaflet/Leaflet.heat
var scale = this._map.getZoomScale(e.zoom);
var offset = this._map._getCenterOffset(e.center)._multiplyBy(-scale).subtract(this._map._getMapPanePos());
if (L.DomUtil.setTransform) {
this._customCanvases.forEach(function(canvas) {
L.DomUtil.setTransform(canvas, offset, scale);
});
} else {
this._customCanvases.forEach(function(canvas) {
canvas.style[L.DomUtil.TRANSFORM] = L.DomUtil.getTranslateString(offset) + ' scale(' + scale + ')';
});
}
},
_resizeCanvas: function() {
// update the canvas size
var size = this._map.getSize();
this._customCanvases.forEach(function(canvas) {
canvas.width = size.x;
canvas.height = size.y;
});
this._resetCanvas();
},
_resetCanvas: function() {
// update the canvas position and redraw its content
var topLeft = this._map.containerPointToLayerPoint([0, 0]);
this._customCanvases.forEach(function(canvas) {
L.DomUtil.setPosition(canvas, topLeft);
});
this._redrawCanvas();
},
_resetCanvasAndWrapGeoJsonCircleMarkers: function() {
this._resetCanvas();
// Leaflet will redraw a CircleMarker when its latLng is changed
// sometimes they are drawn 2+ times if this occurs during many "move" events
// so for now, only chang CircleMarker latlng after a single "moveend" event
this._wrapGeoJsonCircleMarkers();
},
_redrawCanvas: function() {
// draw canvas content (only the Bezier curves)
if (this._map && this.originAndDestinationGeoJsonPoints) {
this._clearCanvas();
// loop over each of the "selected" features and re-draw the canvas paths
this._drawSelectedCanvasPaths(false);
if (this._animationFrameId) {
L.Util.cancelAnimFrame(this._animationFrameId);
}
if (
this.options.animationStarted &&
this.originAndDestinationGeoJsonPoints.features.some(function(feature) {
return feature.properties._isSelectedForPathDisplay;
})
) {
// start animation loop if the layer is currently set for showing animations,
// and if there is at least 1 feature selected for displaying paths
this._animator();
}
}
},
_clearCanvas: function() {
this._customCanvases.forEach(function(canvas) {
canvas.getContext('2d').clearRect(0, 0, canvas.width, canvas.height);
});
if (this._animationFrameId) {
L.Util.cancelAnimFrame(this._animationFrameId);
}
},
_drawSelectedCanvasPaths: function(animate) {
var ctx = animate ?
this._animationCanvasElement.getContext('2d') :
this._canvasElement.getContext('2d');
var originAndDestinationFieldIds = this.options.originAndDestinationFieldIds;
this.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
if (feature.properties._isSelectedForPathDisplay) {
var originXCoordinate = feature.properties[originAndDestinationFieldIds.originGeometry.x];
var originYCoordinate = feature.properties[originAndDestinationFieldIds.originGeometry.y];
var destinationXCoordinate = feature.properties[originAndDestinationFieldIds.destinationGeometry.x];
var destinationYCoordinate = feature.properties[originAndDestinationFieldIds.destinationGeometry.y];
// origin and destination points for drawing curved lines
// ensure that canvas features will be drawn beyond +/-180 longitude
var originLatLng = this._wrapAroundLatLng(L.latLng([originYCoordinate, originXCoordinate]));
var destinationLatLng = this._wrapAroundLatLng(L.latLng([destinationYCoordinate, destinationXCoordinate]));
// convert geometry to screen coordinates for canvas drawing
var screenOriginPoint = this._map.latLngToContainerPoint(originLatLng);
var screenDestinationPoint = this._map.latLngToContainerPoint(destinationLatLng);
// get the canvas symbol properties,
// and draw a curved canvas line
var symbol;
if (animate) {
symbol = this._getSymbolProperties(feature, this.options.animatedCanvasBezierStyle);
ctx.beginPath();
this._animateCanvasLineSymbol(ctx, symbol, screenOriginPoint, screenDestinationPoint);
ctx.stroke();
ctx.closePath();
} else {
symbol = this._getSymbolProperties(feature, this.options.canvasBezierStyle);
ctx.beginPath();
this._applyCanvasLineSymbol(ctx, symbol, screenOriginPoint, screenDestinationPoint);
ctx.stroke();
ctx.closePath();
}
}
}, this);
},
_getSymbolProperties: function(feature, canvasSymbolConfig) {
// get the canvas symbol properties
var symbol;
var filteredSymbols;
if (canvasSymbolConfig.type === 'simple') {
symbol = canvasSymbolConfig.symbol;
} else if (canvasSymbolConfig.type === 'uniqueValue') {
filteredSymbols = canvasSymbolConfig.uniqueValueInfos.filter(function(info) {
return info.value === feature.properties[canvasSymbolConfig.field];
});
symbol = filteredSymbols[0].symbol;
} else if (canvasSymbolConfig.type === 'classBreaks') {
filteredSymbols = canvasSymbolConfig.classBreakInfos.filter(function(info) {
return (
info.classMinValue <= feature.properties[canvasSymbolConfig.field] &&
info.classMaxValue >= feature.properties[canvasSymbolConfig.field]
);
});
if (filteredSymbols.length) {
symbol = filteredSymbols[0].symbol;
} else {
symbol = canvasSymbolConfig.defaultSymbol;
}
}
return symbol;
},
_applyCanvasLineSymbol: function(ctx, symbolObject, screenOriginPoint, screenDestinationPoint) {
ctx.lineCap = symbolObject.lineCap;
ctx.lineWidth = symbolObject.lineWidth;
ctx.strokeStyle = symbolObject.strokeStyle;
ctx.shadowBlur = symbolObject.shadowBlur;
ctx.shadowColor = symbolObject.shadowColor;
ctx.moveTo(screenOriginPoint.x, screenOriginPoint.y);
ctx.bezierCurveTo(screenOriginPoint.x, screenDestinationPoint.y, screenDestinationPoint.x, screenDestinationPoint.y, screenDestinationPoint.x, screenDestinationPoint.y);
},
_animateCanvasLineSymbol: function(ctx, symbolObject, screenOriginPoint, screenDestinationPoint) {
ctx.lineCap = symbolObject.lineCap;
ctx.lineWidth = symbolObject.lineWidth;
ctx.strokeStyle = symbolObject.strokeStyle;
ctx.shadowBlur = symbolObject.shadowBlur;
ctx.shadowColor = symbolObject.shadowColor;
ctx.setLineDash([symbolObject.lineDashOffsetSize, (this._animationPropertiesStatic.resetOffset - symbolObject.lineDashOffsetSize)]);
ctx.lineDashOffset = -this._animationPropertiesStatic.offset; // this makes the dot appear to move when the entire top canvas is redrawn
ctx.moveTo(screenOriginPoint.x, screenOriginPoint.y);
ctx.bezierCurveTo(screenOriginPoint.x, screenDestinationPoint.y, screenDestinationPoint.x, screenDestinationPoint.y, screenDestinationPoint.x, screenDestinationPoint.y);
},
_animator: function(time) {
this._animationCanvasElement.getContext('2d')
.clearRect(0, 0, this._animationCanvasElement.width, this._animationCanvasElement.height);
this._drawSelectedCanvasPaths(true); // draw it again to give the appearance of a moving dot with a new lineDashOffset
TWEEN.update(time);
this._animationFrameId = L.Util.requestAnimFrame(this._animator, this);
},
_wrapGeoJsonCircleMarkers: function() {
// ensure that the GeoJson point features,
// which are drawn on the map as individual CircleMarker layers,
// will be drawn beyond +/-180 longitude
this.eachLayer(function(layer) {
var wrappedLatLng = this._wrapAroundLatLng(layer.getLatLng());
layer.setLatLng(wrappedLatLng);
}, this);
},
_wrapAroundLatLng: function(latLng) {
if (this._map && this.options.wrapAroundCanvas) {
var wrappedLatLng = latLng.clone();
var mapCenterLng = this._map.getCenter().lng;
var wrapAroundDiff = mapCenterLng - wrappedLatLng.lng;
if (wrapAroundDiff < -180 || wrapAroundDiff > 180) {
wrappedLatLng.lng += (Math.round(wrapAroundDiff / 360) * 360);
}
return wrappedLatLng;
} else {
return latLng;
}
}
});
return CanvasFlowmapLayer;
}, window));
\ No newline at end of file
/*
* Copyright 2019 - All rights reserved.
* Copyright 2019-2020 - All rights reserved.
* Rodrigo Tapia-McClung
*
* August-September 2019
* August 2019 - June 2020
*/
/* global baseFileSize, formatBytes, Promise, omnivore, JSZip, map, layerControl, updateCharts */
/* exported makeBaseMap, baseLayerPromises, drawnItems */
/* global baseFileSize, formatBytes, Promise, omnivore, JSZip, map, layerControl, intervals, updateCharts, odClick, am4core*/
/* exported, odData, makeBaseMap, baseLayerPromises, drawnItems */
/* Lines related to displaying loading bar are commented */
......@@ -18,7 +18,9 @@ let baseLayerPromises = [];
baseLayerCounter = 0,
currentBaseLayer = 1;*/
let drawnItems;
//let drawnItems;
let od, flowMapsArray = [],
odData = {};
/*Object.keys(baseFileSize).forEach((name) => {
if (name.split(".")[1] == "zip") {
......@@ -28,6 +30,10 @@ let drawnItems;
}
});*/
function compare(el1, el2, index) {
return el1[index] == el2[index] ? 0 : (el1[index] < el2[index] ? -1 : 1);
}
// function to read compressed json and create a leaflet layer
const zip2Lyr = (zipFile, layerName, layerTemplate) => {
baseLayerPromises.push(
......@@ -661,7 +667,8 @@ let layer_agebs2005 = new L.geoJson(null, {
attribution: "",
// pane: "pane_agebs2005",
//onEachFeature: pop_ANPs,
style: style_agebs2005
style: style_agebs2005,
interactive: false
});
const style_agebs2010 = () => {
......@@ -683,7 +690,8 @@ let layer_agebs2010 = new L.geoJson(null, {
attribution: "",
// pane: "pane_agebs2010",
//onEachFeature: pop_ANPs,
style: style_agebs2010
style: style_agebs2010,
interactive: false
});
const style_agebs2015 = () => {
......@@ -705,7 +713,8 @@ let layer_agebs2015 = new L.geoJson(null, {
attribution: "",
// pane: "pane_agebs2015",
//onEachFeature: pop_ANPs,
style: style_agebs2015
style: style_agebs2015,
interactive: false
});
let crecimiento_urbano = new L.layerGroup([layer_agebs2005, layer_agebs2010, layer_agebs2015], {
......@@ -724,7 +733,7 @@ const style_centros = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: .4,
fillColor: getCentrosColor(feature.properties['OCUPADOS']),
fillColor: getCentrosColor(feature.properties["OCUPADOS"]),
fillPattern: "stripes"
}
}
......@@ -733,7 +742,8 @@ let layer_centros = new L.geoJson(null, {
attribution: "",
pane: "pane_centros",
//onEachFeature: pop_ANPs,
style: style_centros
style: style_centros,
interactive: false
});
const style_hacia = feature => {
......@@ -747,7 +757,7 @@ const style_hacia = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: 0.5,
fillColor: getHaciaColor(feature.properties['PERSONAS'])
fillColor: getHaciaColor(feature.properties["PERSONAS"])
}
}
......@@ -769,7 +779,7 @@ const style_desde = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: 0.5,
fillColor: getDesdeColor(feature.properties['PERSONAS'])
fillColor: getDesdeColor(feature.properties["PERSONAS"])
}
}
......@@ -791,7 +801,7 @@ const style_centrosPOIC = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: .4,
fillColor: getCentrosColor(feature.properties['POIC']),
fillColor: getCentrosColor(feature.properties["POIC"]),
//fillPattern: "stripes"
}
}
......@@ -814,7 +824,7 @@ const style_haciaPOIC = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: 0.5,
fillColor: getHaciaPOICColor(feature.properties['PERSONAS'])
fillColor: getHaciaPOICColor(feature.properties["PERSONAS"])
}
}
......@@ -836,7 +846,7 @@ const style_desdePOIC = feature => {
weight: 0.5, //1.0,
fill: true,
fillOpacity: 0.5,
fillColor: getDesdePOICColor(feature.properties['PERSONAS'])
fillColor: getDesdePOICColor(feature.properties["PERSONAS"])
}
}
......@@ -847,7 +857,7 @@ let layer_desdePOIC = new L.geoJson(null, {
style: style_desdePOIC
});
const styleDrawnItems = () => {
/*const styleDrawnItems = () => {
let currentId = 0;
drawnItems.eachLayer(l => {
l.feature.properties.id = currentId;
......@@ -881,9 +891,160 @@ const toggleButtons = () => {
b.classList.remove("draw-control-disabled");
}
})
}*/
let canvasPointRenderer = L.canvas({ pane: 'pane_flujos' });
const createFlowLayer = (geojson, type, addOnCreate) => {
return new Promise(resolve => {
let canvasBezierStyle = [],
animatedCanvasBezierStyle = [];
// define styles based on properties and values
intervals[type].values.forEach((val, idx) => {
canvasBezierStyle.push({
classMinValue: idx == 0 ? 0 : intervals[type].values[idx - 1] + 1,
classMaxValue: val,
symbol: {
strokeStyle: intervals[type].colors[idx],
lineWidth: intervals[type].thickness[idx],
lineCap: "round",
shadowColor: intervals[type].colors[idx],
shadowBlur: 1.5
}
});
animatedCanvasBezierStyle.push({
classMinValue: idx == 0 ? 0 : intervals[type].values[idx - 1] + 1,
classMaxValue: val,
symbol: {
strokeStyle: intervals[type].colors[idx],
lineWidth: intervals[type].animThickness[idx],
lineDashOffsetSize: 4,
lineCap: "round",
shadowColor: intervals[type].colors[idx],
shadowBlur: 1.5
}
})
});
$.getJSON(geojson, data => {
// build data array from geojson to be used in amchart
let source = data.features;
let newData = [];
source.forEach(o => newData.push({ 'xVar': o.properties.muni_origen, 'yVar': o.properties.muni_destino, 'flowCount': o.properties.viajes }));
let origins = [],
destinations = [];
newData.forEach(data => {
origins.push(data.xVar); // all origins
destinations.push(data.yVar) // all destinations
});
origins = origins.filter((v, i, a) => a.indexOf(v) === i); // get unique ones
destinations = destinations.filter((v, i, a) => a.indexOf(v) === i); // get unique ones
// add missing combinations with 0 trips
origins.forEach((o) => {
destinations.forEach((d) => {
if (!newData.some(data => data.xVar === o && data.yVar === d)) {
newData.push({ 'xVar': o, 'yVar': d, 'flowCount': 0 });
}
})
});
// sort array by origins and then by destinations
newData.sort((el1, el2) => {
let compared = compare(el1, el2, "xVar")
return compared == 0 ? compare(el1, el2, "yVar") : compared;
});
odData[type] = newData; // push to chart data object to reuse
// TODO: add heatColors to each data array
let flowMapLayer = L.canvasFlowmapLayer(data, {
// Define origins and destination from json values
originAndDestinationFieldIds: {
originUniqueIdField: "id_origen",
originGeometry: {
x: "xo",
y: "yo"
},
destinationUniqueIdField: "id_destino",
destinationGeometry: {
x: "xd",
y: "yd"
}
},
// Line styles
canvasBezierStyle: {
type: "classBreaks",
field: "viajes",
classBreakInfos: canvasBezierStyle
},
// Animated line styles
animatedCanvasBezierStyle: {
type: "classBreaks",
field: "viajes",
classBreakInfos: animatedCanvasBezierStyle
},
// dot styles
style: function(geoJsonFeature) {
if (geoJsonFeature.properties.isOrigin) {
return {
renderer: canvasPointRenderer,
radius: 5,
weight: 1,
color: 'rgb(195, 255, 62)',
fillColor: 'rgba(195, 255, 62, 0.6)',
fillOpacity: 0.6
};
} else {
return {
renderer: canvasPointRenderer,
radius: 2.5,
weight: 0.25,
color: 'rgb(17, 142, 170)',
fillColor: 'rgb(17, 142, 170)',
fillOpacity: 0.7
};
}
},
// some custom options
pathDisplayMode: "all",
animationStarted: true,
//animationEasingFamily: "Cubic",
//animationEasingType: "In",
animationEasingFamily: "Linear",
animationEasingType: "None",
animationDuration: 2000,
customLayerId: type,
pane: "pane_flujos"
}).bindTooltip(layer => { // what to display on hover
let coords = layer.getLatLng();
let label = od.features.filter(f => f.properties.lng == coords.lng && f.properties.lat == coords.lat);
return label[0].properties.nombre;
})
// if layer is to be added on creation, add click funcionality and populate chart
if (addOnCreate) {
flowMapLayer.addTo(map).on('click', odClick);
let odChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "topChart");
odChart.data = newData;
let chordChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "bottomLeftChart");
chordChart.data = newData;
chordChart.data = chordChart.data.filter(function(e) { return e.flowCount > 0 });
}
flowMapsArray.push(flowMapLayer);
resolve(flowMapsArray);
});
});
}
const makeBaseMap = () => {
//return new Promise( resolve=> {
createPane("pane_munis", 402);
createPane("pane_munis_contexto", 402);
createPane("pane_ZMs", 403);
......@@ -909,6 +1070,7 @@ const makeBaseMap = () => {
createPane("pane_desdePOIC", 414);
createPane("pane_haciaPOIC", 415);
createPane("pane_agebs", 421);
createPane("pane_flujos", 422);
/*$("#basemap-fileLoad").html("Cargando capa 1 de " + baseLayerCounter + "<br>" +
"<span class=\"progress\"><span id=\"baseBar\" class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" style=\"width: 0%;\" aria-valuenow=\"0\" aria-valuemin=\"0\" aria-valuemax=\"100\"></span>" +
......@@ -922,7 +1084,8 @@ const makeBaseMap = () => {
zip2Lyr("../centropais/data/agebs_urbanos2005.zip", agebs2005, layer_agebs2005);
zip2Lyr("../centropais/data/expansion_agebs2010.zip", agebs2010, layer_agebs2010);
zip2Lyr("../centropais/data/expansion_agebs2015.zip", agebs2015, layer_agebs2015);
layerControl.addOverlay(crecimiento_urbano, "Crecimiento urbano 2005-2015<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#730000\" stroke=\"#730000\" stroke-dasharray=\" \"></rect></svg> Expansión del área de los AGEB's urbanos 2015<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#ffaa00\" stroke = \"#ffaa00\" stroke-dasharray=\" \"></rect></svg> Expansión del área de los AGEB's urbanos 2010<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#ffffd3\" stroke = \"#d6c996\" stroke-dasharray=\" \"></rect></svg> Área ocupada por los AGEBS's urbanos en 2005");
layerControl.addOverlay(crecimiento_urbano, "Crecimiento urbano 2005-2015<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#730000\" stroke=\"#730000\" stroke-dasharray=\" \"></rect></svg> Expansión del área de los AGEB's urbanos 2015<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#ffaa00\" stroke = \"#ffaa00\" stroke-dasharray=\" \"></rect></svg> Expansión del área de los AGEB's urbanos 2010<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#ffffd3\" stroke = \"#d6c996\" stroke-dasharray=\" \"></rect></svg> Área ocupada por los AGEBS's urbanos en 2005");
crecimiento_urbano.addTo(map);
zip2Lyr("../centropais/data/industria_automotriz_2010.zip", auto2010, layer_auto2010);
layerControl.addOverlay(layer_auto2010, "&nbsp; <i class=\"fa fa-desechos\" style=\"color:#00799f;margin-top:3px;margin-left:0px;font-size: 8px;opacity:0.75;\"></i>&nbsp;&nbsp;Unidades económicas en la industria automotriz 2010 ");
zip2Lyr("../centropais/data/industria_automotriz_2014.zip", auto2014, layer_auto2014);
......@@ -937,6 +1100,7 @@ const makeBaseMap = () => {
layerControl.addOverlay(layer_tecnologia2018, "&nbsp; <i class=\"fa fa-desechos\" style=\"color:#c70039;margin-top:3px;margin-left:0px;font-size: 8px;opacity:0.75;\"></i>&nbsp;&nbsp;Unidades económicas en la industria de tecnología media-alta 2018 ");
zip2Lyr("../centropais/data/Centros_de_mercado_de_ocupados.zip", centros, layer_centros);
layerControl.addOverlay(layer_centros, "Centros de mercado <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#d1ff73\" stroke=\"#aaff00\" stroke-dasharray=\" \"></rect></svg> Terciario<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#8e1973\" stroke = \"#a80084\" stroke-dasharray=\" \"></rect></svg> Secundario<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#ff5500\" stroke = \"#e60000\" stroke-dasharray=\" \"></rect></svg> Primario");
layer_centros.addTo(map);
zip2Lyr("../centropais/data/hacia.zip", hacia, layer_hacia);
layerControl.addOverlay(layer_hacia, "Número de ocupados <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#e3fcd9\" stroke=\"#6e6e6e\" stroke-dasharray=\" \"></rect></svg> 0 - 1000<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height=\"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#b4d787\" stroke = \"#6e6e6e\" stroke-dasharray=\" \"></rect></svg> 1001 - 2000<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#4bc44f\" stroke = \"#6e6e6e\" stroke-dasharray=\" \"></rect></svg> 2001 - 6000 <br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#218542\" stroke = \"#6e6e6e\" stroke-dasharray=\" \"></rect></svg> 6001 - 32000 <br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<svg height = \"15\" width=\"15\"><path d=\"M0 0 L15 0 L15 10 L0 10 Z \" x=\"5\" y=\"5\" fill=\"#00451c\" stroke = \"#6e6e6e\" stroke-dasharray=\" \"></rect></svg> 32001 - 53300");
zip2Lyr("../centropais/data/desde.zip", desde, layer_desde);
......@@ -956,8 +1120,60 @@ const makeBaseMap = () => {
layerControl.addOverlay(layer_limiteEstatal, "Límite estatal <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src=\"http://gaia.inegi.org.mx/NLB/tunnel/wms/wms61?version=1.3.0&service=WMS&request=GetLegendGraphic&sld_version=1.1.0&layer=c100&format=image/png&STYLE=default\" alt=\"Límite Estatal\"/>");
// Localize Leaflet.Draw texts
L.drawLocal = {
let resetControl = L.control({
position: "topleft"
});
resetControl.onAdd = () => {
let div = L.DomUtil.create("div", "leaflet-bar leaflet-control");
div.innerHTML = "<button type=\"button\" class=\"btn btn-sm btn-light\" id=\"resetFlows\" title=\"Reiniciar fujos\"><i class=\"fa fa-sync-alt\"></i></button>";
//div.innerHTML = "<a class=\"btn btn-sm btn-light\" href=\"#\" role=\"button\" id=\"resetFlows\" title=\"Reiniciar fujos\" aria-label=\"aaa\"><i class=\"fa fa-sync-alt\"></i></a>";
return div;
};
resetControl.addTo(map);
$.getJSON("data/od.geojson", data => {
od = data;
});
// create one flow, then another, then another...
// and finally set reset control funcionality
createFlowLayer("data/viajes_ocupados_desde.geojson", "ocupadosDesde", true)
.then(() => createFlowLayer("data/viajes_ocupados_hacia.geojson", "ocupadosHacia"))
.then(() => createFlowLayer("data/viajes_ocupados_entre.geojson", "ocupadosEntre"))
.then(() => createFlowLayer("data/viajes_ocupados_POIC_desde.geojson", "poicDesde"))
.then(() => createFlowLayer("data/viajes_ocupados_POIC_hacia.geojson", "poicHacia"))
.then(() => createFlowLayer("data/viajes_ocupados_POIC_entre.geojson", "poicEntre"))
.then(layers => {
// reset to all flows displayed
$("#resetFlows").on("click", () => {
layers.forEach(layer => {
if (map.hasLayer(layer)) {
layer.originAndDestinationGeoJsonPoints.features.forEach(function(feature) {
if (feature.properties.isOrigin === true) {
feature.properties._isSelectedForPathDisplay = true;
} else {
feature.properties._isSelectedForPathDisplay = false;
}
});
layer._resetCanvas();
$("#odTableRow").addClass("align-self-center");
$("#odCard").show();
$("#tblViajes").hide();
$("#tblViajes tbody").html("");
}
});
// TODO: reset amchart
//let amchart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "amchartdiv")
//amchart.data = odData.ocupadosDesde;
});
//resolve(layers);
});
//});
/* // Localize Leaflet.Draw texts
L.drawLocal = {
draw: {
toolbar: {
actions: {
......@@ -1065,96 +1281,97 @@ const makeBaseMap = () => {
}
}
// leaflet draw control
drawnItems = L.featureGroup().addTo(map);
let drawControl = new L.Control.Draw({
draw: {
polygon: {
showArea: true,
//allowIntersection: false, // Restricts shapes to simple polygons
//drawError: {
//color: "#f9a800",
//message: "<strong>you can't draw that!" // Message that will show when intersect
//},
shapeOptions: {
color: "#42ffc3"
}
},
// disable toolbar item by setting it to false
polyline: {
//allowIntersection:false,
shapeOptions: {
color: "#42ffc3"
}
},
rectangle: {
shapeOptions: {
color: "#42ffc3"
}
drawnItems = L.featureGroup().addTo(map);
let drawControl = new L.Control.Draw({
draw: {
polygon: {
showArea: true,
//allowIntersection: false, // Restricts shapes to simple polygons
//drawError: {
//color: "#f9a800",
//message: "<strong>you can't draw that!" // Message that will show when intersect
//},
shapeOptions: {
color: "#42ffc3"
}
},
// disable toolbar item by setting it to false
polyline: {
//allowIntersection:false,
shapeOptions: {
color: "#42ffc3"
}
},
rectangle: {
shapeOptions: {
color: "#42ffc3"
}
},
marker: false,
circlemarker: false,
circle: false // Turns off this drawing tool
},
marker: false,
circlemarker: false,
circle: false // Turns off this drawing tool
},
edit: {
featureGroup: drawnItems,
//remove: false
}
});
map.addControl(drawControl);
edit: {
featureGroup: drawnItems,
//remove: false
}
});
map.addControl(drawControl);
// set z-index of panes so actions can be done on drawnItems when editing/deleting
map.on(L.Draw.Event.CREATED, event => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
let layer = event.layer,
feature = layer.feature = layer.feature || {}; // Initialize feature
// set z-index of panes so actions can be done on drawnItems when editing/deleting
map.on(L.Draw.Event.CREATED, event => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
let layer = event.layer,
feature = layer.feature = layer.feature || {}; // Initialize feature
feature.type = feature.type || "Feature"; // Initialize feature.type
feature.properties = feature.properties || {}; // Initialize feature.properties
feature.type = feature.type || "Feature"; // Initialize feature.type
feature.properties = feature.properties || {}; // Initialize feature.properties
drawnItems.addLayer(layer); // whatever you want to do with the created layer
drawnItems.addLayer(layer); // whatever you want to do with the created layer
// give each drawn item an id and color from an array
styleDrawnItems();
// disable buttons if there are 10 drawn items
toggleButtons();
// give each drawn item an id and color from an array
styleDrawnItems();
// disable buttons if there are 10 drawn items
toggleButtons();
// after drawing shape, update chart with data for polygons contained inside it
updateCharts();
});
// after drawing shape, update chart with data for polygons contained inside it
updateCharts();
});
map.on(L.Draw.Event.DELETESTART, () => {
// before deleting shape, bring pane up
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "451");
});
map.on(L.Draw.Event.DELETESTART, () => {
// before deleting shape, bring pane up
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "451");
});
map.on(L.Draw.Event.DELETED, () => {
// after deleting a drawn item, refresh the list of ids and colors
styleDrawnItems();
// enable buttons if there are less than 10 drawn items
toggleButtons();
// after deleting shape, send pane down
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// and update chart with data:
// if there are drawnItems, use them. If not, use original data
updateCharts();
});
map.on(L.Draw.Event.DELETED, () => {
// after deleting a drawn item, refresh the list of ids and colors
styleDrawnItems();
// enable buttons if there are less than 10 drawn items
toggleButtons();
map.on(L.Draw.Event.EDITSTART, () => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "451");
// before editing shape, bring pane up
});
// after deleting shape, send pane down
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// and update chart with data:
// if there are drawnItems, use them. If not, use original data
updateCharts();
});
map.on(L.Draw.Event.EDITSTOP, () => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// before editing shape, bring pane up
});
map.on(L.Draw.Event.EDITSTART, () => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "451");
// before editing shape, bring pane up
});
map.on(L.Draw.Event.EDITED, () => {
// before editing shape, send pane down
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// after editing shape, update chart with data for polygons contained inside it
updateCharts();
});
map.on(L.Draw.Event.EDITSTOP, () => {
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// before editing shape, bring pane up
});
map.on(L.Draw.Event.EDITED, () => {
// before editing shape, send pane down
$("#mexmap .leaflet-pane.leaflet-overlay-pane").css("z-index", "400");
// after editing shape, update chart with data for polygons contained inside it
updateCharts();
});
*/
}
\ No newline at end of file
/*
* Copyright 2020 - All rights reserved.
* Rodrigo Tapia-McClung
*
* June 2020
*/
/* globals am4core, am4charts, am4themes_animated, intervals */
let minValue, maxValue;
let mainTextColor = getComputedStyle(document.body).getPropertyValue('--main-text-color');
let cellbgColor = getComputedStyle(document.body).getPropertyValue('--main-bg-color');
// amChart
am4core.ready(function() {
// Themes begin
//am4core.useTheme(am4themes_animated);
am4core.options.autoSetClassName = true;
// Themes end
var chart = am4core.create("topChart", am4charts.XYChart);
chart.maskBullets = false;
var title = chart.titles.create();
//title.text = "Viajes de ocupados desde centros de mercado";
title.fill = am4core.color(mainTextColor);
title.fontSize = 15;
title.marginBottom = 15;
chart.events.on("beforedatavalidated", function(ev) {
let option = $("#indicatorSelect").val();
let optionTitle = $("#indicatorSelect option:selected").text();
title.text = optionTitle;
var data = ev.target.data;
minValue = d3.min(data, function(d) { return d.flowCount || Infinity; });
maxValue = d3.max(data, function(d) { return d.flowCount; });
//heatLegend.minValue = minValue;
//heatLegend.maxValue = maxValue;
heatLegend.minValue = 0;
heatLegend.maxValue = intervals[option].values[intervals[option].values.length - 1];
// update heatLegend colors
let heatColors = [];
["#333", ...intervals[option].colors].forEach(c => heatColors.push(am4core.color(c)));
heatLegend.minColor = heatColors[0];
heatLegend.maxColor = heatColors[intervals[option].colors.length - 1];
//let checkConditions = [minValue, ...intervals[option].values.slice(1)];
let checkConditions = [minValue, ...intervals[option].values];
let lastValue = intervals[option].values[intervals[option].values.length - 1]
// Override heatLegend gradient
let gradient = new am4core.LinearGradient();
heatColors.forEach(function(color, index) {
// addColor(color, opacity, offset) use offset to put colors in proper alignment
gradient.addColor(color, undefined, (checkConditions[index] - checkConditions[0]) / lastValue);
});
//heatLegend.markers.template.applyOnClones = true;
heatLegend.markers.clear();
heatLegend.markers.template.adapter.add("fill", function() {
return gradient;
});
// update cell colors
columnTemplate.adapter.add("fill", function(fill, column) {
let workingValue = column.dataItem.values["value"].workingValue;
// use min max values calculated from data on beforedatavalidated
if (am4core.type.isNumber(workingValue)) {
checkConditions.forEach((condition, index) => {
if (index < checkConditions.length - 1) {
if (workingValue >= condition && workingValue <= checkConditions[index + 1]) {
//console.log(`${workingValue} entre ${condition} y ${checkConditions[index+1]}`)
fill = new am4core.Color(
am4core.colors.interpolate(
heatColors[index].rgb,
heatColors[index + 1].rgb,
workingValue
)
);
//console.log(workingValue, intervals.ocupadosDesde.colors[index])
} else if (workingValue < checkConditions[0]) {
fill = new am4core.color(cellbgColor);
}
}
});
}
return fill;
});
});
var xAxis = chart.xAxes.push(new am4charts.CategoryAxis());
var yAxis = chart.yAxes.push(new am4charts.CategoryAxis());
xAxis.dataFields.category = "xVar";
yAxis.dataFields.category = "yVar";
xAxis.renderer.grid.template.disabled = true;
xAxis.renderer.minGridDistance = 10;
xAxis.renderer.opposite = true;
//xAxis.renderer.labels.template.rotation = -45;
/*xAxis.renderer.labels.template.adapter.add("dy", function(dy, target) {
if (target.dataItem && target.dataItem.index & 2 == 2) {
return dy - 15;
}
return dy;
});*/
xAxis.title.text = "[bold]Origen[/]";
xAxis.title.fontSize = 15
xAxis.title.paddingBottom = -10;
xAxis.title.paddingTop = -10;
xAxis.renderer.labels.template.truncate = true;
// on axis size change, resize labels
//FIXME: 80% hack should be better
xAxis.events.on("sizechanged", function(ev) {
let axis = ev.target;
let cellWidth = axis.pixelWidth / (axis.endIndex - axis.startIndex);
axis.renderer.labels.template.maxWidth = 2 * Math.ceil(cellWidth) * 0.8;
});
// on data change change, resize labels
//FIXME: 80% hack should be better
xAxis.events.on("datarangechanged", function(ev) {
let axis = ev.target;
let cellWidth = axis.pixelWidth / (axis.endIndex - axis.startIndex);
axis.renderer.labels.template.maxWidth = 2 * Math.ceil(cellWidth) * 0.8;
});
xAxis.renderer.labels.template.fontSize = 12;
xAxis.tooltip.fontSize = 13;
xAxis.title.fill = am4core.color(mainTextColor);
xAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
yAxis.renderer.grid.template.disabled = true;
yAxis.renderer.inversed = true;
yAxis.renderer.minGridDistance = 1;
yAxis.title.text = "[bold]Destino[/]";
yAxis.title.fontSize = 15
yAxis.title.paddingBottom = -10;
yAxis.renderer.labels.template.truncate = true;
yAxis.renderer.labels.template.maxWidth = 120;
yAxis.renderer.labels.template.fontSize = 12;
yAxis.tooltip.fontSize = 13;
yAxis.title.fill = am4core.color(mainTextColor);
yAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
var series = chart.series.push(new am4charts.ColumnSeries());
series.dataFields.categoryX = "xVar";
series.dataFields.categoryY = "yVar";
series.dataFields.value = "flowCount";
series.sequencedInterpolation = true;
series.cursorTooltipEnabled = false;
series.defaultState.transitionDuration = 3000;
// Add cursor
chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "none";
chart.cursor.xAxis = xAxis;
chart.cursor.yAxis = yAxis;
chart.cursor.fullWidthLineX = true;
chart.cursor.fullWidthLineY = true;
chart.cursor.lineX.fill = am4core.color(mainTextColor);
chart.cursor.lineX.fillOpacity = 0.05;
chart.cursor.lineY.fill = am4core.color(mainTextColor);
chart.cursor.lineY.fillOpacity = 0.05;
var bgColor = new am4core.InterfaceColorSet().getFor("background");
var columnTemplate = series.columns.template;
columnTemplate.applyOnClones = true;
columnTemplate.strokeWidth = 2;
columnTemplate.strokeOpacity = 0;
columnTemplate.stroke = bgColor;
//columnTemplate.tooltipText = "{xVar} -> {yVar}: {value.workingValue.formatNumber('#.')}";
columnTemplate.tooltipHTML = `<div class="amcharttooltip">{xVar} <i class="fas fa-long-arrow-alt-right"></i> {yVar}: {value.workingValue.formatNumber('#,###')}</div>`;
columnTemplate.width = am4core.percent(100);
columnTemplate.height = am4core.percent(100);
columnTemplate.column.cornerRadius(4, 4, 4, 4);
columnTemplate.column.padding(0.5, 0.5, 0.5, 0.5);
columnTemplate.adapter.add("strokeWidth", function(width, column) {
var workingValue = column.dataItem.values["value"].workingValue;
if (am4core.type.isNumber(workingValue)) {
width = workingValue != 0 ? 1 : 0;
}
return width;
});
// heat legend
//var heatLegend = chart.createChild(am4charts.HeatLegend);
var heatLegend = chart.bottomAxesContainer.createChild(am4charts.HeatLegend);
heatLegend.marginTop = 5;
//heatLegend.marginBotom = 50;
heatLegend.width = am4core.percent(100);
//heatLegend.align = "right";
//heatLegend.markerContainer.height = 10;
heatLegend.markerContainer.minHeight = 20;
heatLegend.markers.template.minHeight = 20;
heatLegend.series = series;
heatLegend.valueAxis.renderer.labels.template.fontSize = 12;
heatLegend.valueAxis.renderer.minGridDistance = 35;
heatLegend.valueAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
heatLegend.valueAxis.renderer.labels.template.paddingTop = 5;
heatLegend.valueAxis.tooltip.fontSize = 13;
// heatLegend min, max, colors and fill are modified above using adapters
// when chart changes size, what happens with heatLegend fill
heatLegend.markers.template.events.on("sizechanged", function(event) {
event.target.fill = event.target.fill;
});
// heat legend behavior
series.columns.template.events.on("over", function(event) {
handleHover(event.target);
})
series.columns.template.events.on("hit", function(event) {
handleHover(event.target);
})
function handleHover(column) {
if (!isNaN(column.dataItem.value)) {
column.strokeWidth = 2;
column.strokeOpacity = 0.2;
heatLegend.valueAxis.showTooltipAt(column.dataItem.value);
} else {
column.strokeWidth = 0;
column.strokeOpacity = 0;
heatLegend.valueAxis.hideTooltip();
}
}
series.columns.template.events.on("out", function(event) {
event.target.strokeWidth = 0;
event.target.strokeOpacity = 0;
heatLegend.valueAxis.hideTooltip();
})
//chart.dataSource.url = "data/odm.json";
//chart.dataSource.url = "data/viajes_ocupados_desde.geojson";
chart.responsive.enabled = true;
//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++CC
// Themes begin
am4core.useTheme(am4themes_animated);
// Themes end
var cd_chart = am4core.create("bottomLeftChart", am4charts.ChordDiagram);
var cd_title = cd_chart.titles.create();
//cd_title.text = "Viajes de ocupados desde centros de mercado";
cd_title.fill = am4core.color(mainTextColor);
cd_title.fontSize = 13;
cd_title.align = "left";
cd_title.marginBottom = 20;
cd_title.paddingLeft = 10;
cd_chart.events.on("beforedatavalidated", function(ev) {
//let option = $("#indicatorSelect").val();
let optionTitle = $("#indicatorSelect option:selected").text();
cd_title.text = "[bold]Conectividad origen - destino entre \n" + optionTitle.toLowerCase();
//var data = ev.target.data;
//let data = data.filter(function(e) { return e.flowCount > 0 });
//console.log(data);
});
cd_chart.dataFields.fromName = "xVar";
cd_chart.dataFields.toName = "yVar";
cd_chart.dataFields.value = "flowCount";
//cd_chart.labels.fontSize = 15;
// make nodes draggable
var nodeTemplate = cd_chart.nodes.template;
nodeTemplate.readerTitle = "Oculta/muestra para reorganizar la red"; //"Click to show/hide or drag to rearrange";
nodeTemplate.showSystemTooltip = true;
var nodeLink = cd_chart.links.template;
var bullet = nodeLink.bullets.push(new am4charts.CircleBullet());
bullet.fillOpacity = 0.8;
bullet.circle.radius = 3;
bullet.locationX = 0.5;
// create animations
//cd_chart.events.once("over", function()
nodeTemplate.events.on("ready", function() {
for (var i = 0; i < cd_chart.links.length; i++) {
var link = cd_chart.links.getIndex(i);
var bullet = link.bullets.getIndex(0);
animateBullet(bullet);
}
})
function animateBullet(bullet) {
var duration = cd_chart.links.length * Math.random() + 3000;
var animation = bullet.animate([{ property: "locationX", from: 0, to: 1.05 }], duration)
animation.events.on("animationended", function(event) {
animateBullet(event.target.object)
})
}
var label = nodeTemplate.label;
label.relativeRotation = 90;
label.fontSize = 10;
label.fill = am4core.color(mainTextColor);
//label.wrap = true;
//label.bent = true;
cd_chart.responsive.enabled = true;
}); // end am4core.ready()
\ No newline at end of file
/*
* Copyright 2019 - All rights reserved.
* Copyright 2019-2020 - All rights reserved.
* Rodrigo Tapia-McClung
*
* August-September 2019
* August 2019 - June 2020
*/
/* globals omnivore, Promise, chroma, makeBaseMap, makeIndicatorGraph, getData, getDataInSelection */
/* exported indicators. userFiles, userDates, timeParse, layerControl, updateCharts */
/* exported indicators. userFiles, userDates, timeParse, layerControl, updateCharts, intervals */
let timeParse,
timeFormat,
......@@ -30,9 +30,17 @@ let timeParse,
// define empty objects and indicators
let maxIndicators = {},
minIndicators = {},
indicators = ["area", "perimeter", "costa", "df"],
indicatorsNames = ["Área", "Perímetro", "Desarrollo de la línea de costa", "Dimensión fractal"],
indicatorsUnits = ["m\u00B2", "m", "", ""],
//indicators = ["area", "perimeter", "costa", "df"],
indicators = ["ocupadosDesde", "ocupadosHacia", "ocupadosEntre", "poicDesde", "poicHacia", "poicEntre"],
indicatorsNames = ["Viajes de ocupados desde centros de mercado", "Viajes de ocupados hacia centros de mercado",
"Viajes de ocupados entre zonas", "Viajes de personas en OIC desde centros de mercado",
"Viajes de personas en OIC hacia centros de mercado", "Viajes de personas en OIC entre zonas"
],
indicatorsShortNames = ["Ocupados desde <br/> centros de mercado", "Ocupados hacia <br/> centros de mercado",
"Ocupados entre zonas", "OIC desde centros <br/> de mercado",
"OIC hacia centros <br/> de mercado", "OIC entre zonas"
],
//indicatorsUnits = ["m\u00B2", "m", "", ""],
indicatorsxAxisFormat = [".2s", ".2s", ".2f", ".2f"],
indicatorVars = {},
cols = [];
......@@ -55,6 +63,52 @@ indicators.forEach((indicator, index) => {
};
});
let intervals = {
"ocupadosDesde": {
"classes": ["Menos de 1,000", "1,001 - 2,000", "2,001 - 6,000", "6,001 - 7,200"],
"values": [1000, 2000, 6000, 7200],
"colors": ["#00c5ff", "#008fdc", "#005ce6", "#4c0073"],
"thickness": [0.5, 1.5, 2, 10],
"animThickness": [0.5, 1.5, 4, 15]
},
"ocupadosHacia": {
"classes": ["Menos de 1,000", "1,001 - 2,000", "2,001 - 6,000", "6,001 - 32,000", "32,001 - 53,300"],
"values": [1000, 2000, 6000, 32000, 53300],
"colors": ["#ffbee8", "#ff73df", "#ff00c5", "#ad027d", "#80006b"],
"thickness": [0.5, 1.5, 2, 4, 10],
"animThickness": [0.5, 1.5, 4, 10, 15]
},
"ocupadosEntre": {
"classes": ["Menos de 1,000", "1,001 - 2,000", "2,001 - 3,500", "3,501 - 8,000"],
"values": [1000, 2000, 3500, 8000],
"colors": ["#70a800", "#ffaa00", "#e64c00", "#a80000"],
"thickness": [0.5, 1.5, 2, 4],
"animThickness": [0.5, 1.5, 4, 10]
},
"poicDesde": {
"classes": ["Menos de 150", "151 - 500", "501 - 1,000", "1,001 - 1,500"],
"values": [150, 500, 1000, 1500],
"colors": ["#00c5ff", "#008fe6", "#005ce6", "#002673"],
"thickness": [0.5, 1.5, 2, 4],
"animThickness": [0.5, 1.5, 4, 10]
},
"poicHacia": {
"classes": ["Menos de 200", "201 - 400", "401 - 600", "601 - 3,000", "3,001 - 10,700"],
"values": [200, 400, 600, 3000, 10700],
"colors": ["#ffbee8", "#ff73df", "#ff00c5", "#ad027d", "#80006b"],
"thickness": [0.5, 1.5, 2, 4, 10],
"animThickness": [0.5, 1.5, 4, 10, 15]
},
"poicEntre": {
"classes": ["150 - 500", "501 - 700", "701 - 950", "951 - 1,200"],
"values": [500, 700, 950, 1200],
"colors": ["#70a800", "#ffaa00", "#e64c00", "#a80000"],
"thickness": [0.5, 1.5, 2, 4],
"animThickness": [0.5, 1.5, 4, 10]
}
}
/*
indicatorVars.area.explanation = "Muestra la suma del &aacute;rea contenida en los pol&iacute;gonos dentro de la selecci&oacute;n o en toda la regi&oacute;n de estudio.";
indicatorVars.perimeter.explanation = "Muestra la suma del per&iacute;metro de los pol&iacute;gonos dentro de la selecci&oacute;n o en toda la regi&oacute;n de estudio.";
indicatorVars.costa.explanation = "Relaciona el per&iacute;metro de un cuerpo de agua o longitud de l&iacute;nea de costa con el per&iacute;metro de un c&iacute;rculo de igual \
......@@ -73,6 +127,7 @@ indicatorVars.df.explanation = "La geometr&iacute;a fractal se usa para hacer re
Se calcula como \
<p class=\"equation\">DF = <span class=\"frac\"><sup>2 ln(P/4)</sup><span>&frasl;</span><sub>ln(A)</sub></span>,</p> \
donde P es el per&iacute;metro y A es el &aacute;rea.";
*/
let currentTiles = {},
allTiles = {};
......@@ -84,12 +139,26 @@ d3.json("https://unpkg.com/d3-time-format@2.1.1/locale/es-MX.json").then(locale
timeParse = d3.timeParse("%B_%Y");
timeFormat = d3.timeFormat("%B_%Y");
setupTimeDimensionControl();
// FIX: Need to remove setup and populate dates and only setup and populate map
setupDates()
//setupTimeDimensionControl();
// FIX: Need to remove setup and populate dates and only setup and populate map
/*setupDates()
.then(dates => populateDates(dates))
.then(userData => setupMap(userData))
.then(map => populateMap(map));*/
//$("#showMap").on("click", () => {
// hide initial screen and show map
// TODO: don't need outer call to d3.json, do I? Move this to the bottom after functions definitions
//TODO: remove unused functions
$("#startHeader").remove();
$("#initial-backdrop").remove();
$("#mainContainer")[0].style.setProperty("display", "flex", "important")
$("#mexmap").show();
setupMap()
.then(map => populateMap(map));
//});
});
const sortInitialDateAscending = (a, b) => {
......@@ -217,7 +286,7 @@ const populateDates = (dates) => { // fill out date pickers with available dates
})
}
const setupMap = (dates) => {
const setupMap = () => { //(dates) => {
return new Promise(resolve => {
// make body tag to have style height: 100%
......@@ -236,20 +305,20 @@ const setupMap = (dates) => {
});
//let bounds = cuencaBufferMask.getBounds();
let southWest = L.latLng(19.88, -103.61),
northEast = L.latLng(22.63, -98.00),
let southWest = L.latLng(19.87, -102.87),
northEast = L.latLng(23.02, -99.31),
bounds = L.latLngBounds(southWest, northEast);
map = L.map("mexmap", {
//center: [17.22, -92.28],
minZoom: 7, //8
zoom: 7, //6
minZoom: 8,
zoom: 6,
attributionControl: false,
timeDimension: true,
/*timeDimension: true,
timeDimensionOptions: {
times: userDates,
currentTime: dates.min
},
},*/
maxBounds: bounds
}).setView([21.15, -100.94], 8);
......@@ -309,7 +378,7 @@ const setupMap = (dates) => {
//console.log(userFiles);
// query db to get min/max values per month and indicator and store them in an object
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
/*queryFiles().then(minmax => {
minmax.map(minmaxMonth => {
indicators.forEach((indicator) => {
......@@ -319,7 +388,7 @@ const setupMap = (dates) => {
});
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
});*/
// FIX: resolve with fake values
// FIX: resolve with fake values
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
});
}
......@@ -344,19 +413,54 @@ const getMinMax = table => {
});
}
const odClick = (e) => {
e.target.clearAllPathSelections();
let origins = "";
// select and draw flows from origins
if (e.sharedOriginFeatures.length) {
e.target.selectFeaturesForPathDisplay(e.sharedOriginFeatures, "SELECTION_NEW");
/*e.sharedOriginFeatures.forEach( origin => {
/ origins += `${origin.properties.muni_origen} &rarr; ${origin.properties.muni_destino}: ${origin.properties.viajes} viajes <br>`;
});*/
}
// select and add flows toward those origins, i.e., for dots that are both origins and destinations
let dests = e.target.originAndDestinationGeoJsonPoints.features.filter(f => f.geometry.coordinates[0] === e.latlng.lng && f.geometry.coordinates[1] === e.latlng.lat);
e.target.selectFeaturesForPathDisplay(dests, "SELECTION_ADD");
dests.forEach(dest => {
//origins += `${dest.properties.muni_origen} &rarr; ${dest.properties.muni_destino}: ${dest.properties.viajes} viajes <br>`;
// style viajes thousands with #,###
origins += `<tr><td>${dest.properties.muni_origen}</td><td>${dest.properties.muni_destino}</td><td>${dest.properties.viajes.toLocaleString()}</td></tr>`;
});
$("#odCard").hide();
$("#odTableRow").removeClass("align-self-center");
$("#tblViajes").show();
$("#tblViajes tbody").html(origins);
if (e.sharedDestinationFeatures.length) {
//e.target.selectFeaturesForPathDisplay(e.sharedDestinationFeatures, "SELECTION_ADD");
}
// if dots are only destinations, add paths when clicked on
/*if (e.sharedDestinationFeatures.length) {
e.target.selectFeaturesForPathDisplay(e.sharedDestinationFeatures, "SELECTION_NEW");
}*/
// TODO: trigger chart update to only draw selected origins and destinations?
}
const populateMap = async(mapData) => {
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
//const chartData = await getData();
// fake null data to avoid DB requests
chartData = [];
indicators.map( indicator => {
indicators.map(indicator => {
chartData[indicator] = [];
chartData[indicator].push({name: `${indicator}0`, values: [{"date": new Date("2016-01-01T06:00:00.000Z"),"value":0}]});
chartData[indicator].push({ name: `${indicator}0`, values: [{ "date": new Date("2016-01-01T06:00:00.000Z"), "value": 0 }] });
})
// Define charts with reusable components
indicators.map(async(indicator, index) => {
/*indicators.map(async(indicator, index) => {
// indicatorVars[indicator].chart gives areaChart, perimeterChart, etc.
// First, make all charts with same general options
indicatorVars[indicator].chart = makeIndicatorGraph()
......@@ -386,29 +490,17 @@ const populateMap = async(mapData) => {
// Highlight plot title according to selected option
let option = $("#indicatorSelect").val(); // option selected from dropdrown
d3.select(indicatorVars[option].container).select("svg text.title").classed("active", true);
});
});*/
let map = mapData.map,
minIndicators = mapData.minIndicators,
maxIndicators = mapData.maxIndicators;
let cuencaLayer = L.geoJson(null, {
style: {
stroke: true,
weight: 5,
color: "grey",
opacity: .35,
fillOpacity: 0.05
},
interactive: false
});
let cuencaBufferMask = omnivore.topojson("data/buffer_cuenca.topojson", null, cuencaLayer);
cuencaBufferMask.addTo(map);
//map.createPane("wb-Tiles");
//map.getPane("wb-Tiles").style.zIndex = 450;
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
// create mvt layers
/*userFiles.forEach(f => {
f = mapboxLayer(f);
......@@ -425,7 +517,7 @@ const populateMap = async(mapData) => {
// after mapboxGL map is ready with styles do this:
glmap.getMapboxMap().on("style.load", () => {
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
/*userFiles.forEach(monthYear => {
glmap.getMapboxMap().addLayer(currentTiles[monthYear]);
});
......@@ -436,7 +528,7 @@ const populateMap = async(mapData) => {
}
});*/
timeDimensionControl.addTo(map);
/*timeDimensionControl.addTo(map);
// Pass dummy geojson layer to timeDimension in order to register and sync
timeLayer = L.timeDimension.layer.Tile(L.geoJSON(), {
updateTimeDimension: true,
......@@ -444,9 +536,9 @@ const populateMap = async(mapData) => {
waitForReady: true,
duration: "P1M"
});
timeLayer.addTo(map);
timeLayer.addTo(map);*/
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
// style currentTiles
/*let option = $("#indicatorSelect").val(); // option selected from dropdrown
styleTiles(option, minIndicators, maxIndicators)
......@@ -459,75 +551,77 @@ const populateMap = async(mapData) => {
"OpenStreetMap": osmLayer
};
var overlays = {
// "<span id=\"cuencaOverlay\">Agua en la cuenca del Grijalva</span>": timeLayer
// "<span id=\"cuencaOverlay\">Agua en la cuenca del Grijalva</span>": timeLayer
};
layerControl = L.control.layers(baseLayers, overlays).addTo(map);
makeBaseMap(); // basemap.js
makeBaseMap() // basemap.js
//.then( flowLayers => { });
legend.addTo(map);
// fix for leaflet-mapbox-gl v. 0.0.11 that adds map's to tile pane:
// get children of map tile pane, create array from it and iterate
// setting their z-index
let glmapChildren = map.getPanes().tilePane.children,
children = Array.from(glmapChildren);
children.forEach( c => c.style.zIndex = 'inherit' );
children.forEach(c => c.style.zIndex = "inherit");
});
}
const updateMap = (mapData) => {
//console.log(userFiles);
// FIX: comment out to avoid DB calls
// FIX: comment out to avoid DB calls
// clear tiles
/* currentTiles = {};
//retrieve or create tiles for current dates
userFiles.forEach(monthYear => {
if (Object.keys(allTiles).includes(monthYear)) {
currentTiles[monthYear] = allTiles[monthYear]; // recover tile if it has already been created
//currentJSONs[monthYear] = allJSONs[monthYear]; // recover json if it has already been created
return; // if file has already been processed, exit
} else { // if file cannot be found in allTiles, then add 1 to the number of files to process
let newTile = mapboxLayer(monthYear);
glmap.getMapboxMap().addLayer(newTile);
if (monthYear == userFiles[0]) {
glmap.getMapboxMap().setPaintProperty(monthYear, "fill-opacity", 0.7)
/* currentTiles = {};
//retrieve or create tiles for current dates
userFiles.forEach(monthYear => {
if (Object.keys(allTiles).includes(monthYear)) {
currentTiles[monthYear] = allTiles[monthYear]; // recover tile if it has already been created
//currentJSONs[monthYear] = allJSONs[monthYear]; // recover json if it has already been created
return; // if file has already been processed, exit
} else { // if file cannot be found in allTiles, then add 1 to the number of files to process
let newTile = mapboxLayer(monthYear);
glmap.getMapboxMap().addLayer(newTile);
if (monthYear == userFiles[0]) {
glmap.getMapboxMap().setPaintProperty(monthYear, "fill-opacity", 0.7)
}
}
}
});
});
// update timeDimension times
timeLayer._timeDimension.setAvailableTimes(userDates, "replace");
timeLayer._timeDimension.setCurrentTime(mapData.min);
// update timeDimension times
timeLayer._timeDimension.setAvailableTimes(userDates, "replace");
timeLayer._timeDimension.setCurrentTime(mapData.min);
// clear minmax indicators objects
maxIndicators = {},
minIndicators = {};
indicators.forEach((indicator) => {
maxIndicators[indicator] = 0;
minIndicators[indicator] = 1e30;
});
// clear minmax indicators objects
maxIndicators = {},
minIndicators = {};
indicators.forEach((indicator) => {
maxIndicators[indicator] = 0;
minIndicators[indicator] = 1e30;
});
// query db for new minmax values then style tiles
new Promise(resolve => {
queryFiles().then(minmax => {
minmax.map(minmaxMonth => {
indicators.forEach((indicator) => {
minIndicators[indicator] = Math.min(minIndicators[indicator], minmaxMonth[`min${indicator}`]);
maxIndicators[indicator] = Math.max(maxIndicators[indicator], minmaxMonth[`max${indicator}`]);
// query db for new minmax values then style tiles
new Promise(resolve => {
queryFiles().then(minmax => {
minmax.map(minmaxMonth => {
indicators.forEach((indicator) => {
minIndicators[indicator] = Math.min(minIndicators[indicator], minmaxMonth[`min${indicator}`]);
maxIndicators[indicator] = Math.max(maxIndicators[indicator], minmaxMonth[`max${indicator}`]);
});
});
});
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
})
}).then(values => { // once we have new minmax values, style all tiles
let option = $("#indicatorSelect").val(), // option selected from dropdrown
min = values.minIndicators,
max = values.maxIndicators;
styleTiles(option, min, max)
.then(legend.addTo(map)); // add legend control -> it updates
});
// Update charts
updateCharts();
*/
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
})
}).then(values => { // once we have new minmax values, style all tiles
let option = $("#indicatorSelect").val(), // option selected from dropdrown
min = values.minIndicators,
max = values.maxIndicators;
styleTiles(option, min, max)
.then(legend.addTo(map)); // add legend control -> it updates
});
// Update charts
updateCharts();
*/
}
const updateCharts = async() => {
......@@ -539,12 +633,14 @@ const updateCharts = async() => {
let allData = await getDataInSelection();
indicators.map(async indicator => {
indicatorVars[indicator].chart.data(summarizeData(allData, indicator));
// indicatorVars[indicator].cd_chart.data(summarizeData(allData, indicator));
});
} else {
// otherwise use all data
let allData = await getData();
indicators.map(async indicator => {
indicatorVars[indicator].chart.data(allData[indicator]);
// indicatorVars[indicator].cd_chart.data(allData[indicator]);
});
}
$(".loader").hide("fade", 750);
......@@ -681,6 +777,7 @@ L.TimeDimension.Layer.Tile = L.TimeDimension.Layer.extend({
indicators.forEach(indicator => {
indicatorVars[indicator].chartData = indicatorVars[indicator].chart.data(); // get chart data
indicatorVars[indicator].chart.data(indicatorVars[indicator].chartData); // set chart data
// indicatorVars[indicator].cd_chart.data(indicatorVars[indicator].chartData); // set chart data
});
//console.time("process");
......@@ -701,11 +798,42 @@ L.timeDimension.layer.Tile = (layer, options) => {
return new L.TimeDimension.Layer.Tile(layer, options);
};
// When selecting indicator from dropdown, style tiles.
$("#indicatorSelect").on("change", function() {
// style currentTiles
let option = this.value; // option selected from dropdrown
flowMapsArray.forEach(layer => {
if (layer.options.customLayerId === option) {
map.addLayer(layer);
layer.on('click', odClick);
/*layer.getLayers().forEach(l => {
console.log(l.feature.properties._isSelectedForPathDisplay)
});*/
// TODO: Recover each layer state and populate table according to that
// layer._layers[i].feature.properties._isSelectedforPathDisplay
} else {
layer.off("click", odClick);
map.removeLayer(layer);
}
$("#odTableRow").addClass("align-self-center");
$("#odCard").show();
$("#tblViajes").hide();
$("#tblViajes tbody").html("");
});
// on select, update chart data
let odChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "topChart")
odChart.data = odData[option];
let chordChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "bottomLeftChart")
chordChart.data = odData[option];
chordChart.data = chordChart.data.filter(function(e) { return e.flowCount > 0 });
//console.log(amchart2.data.filter(function(e) { return e.flowCount > 0 }))
styleTiles(option, minIndicators, maxIndicators)
.then(legend.addTo(map)); // add legend control -> it updates
// FIXME: re-adding control updates its contents... why?
......@@ -727,7 +855,7 @@ const styleTiles = (option, minIndicators, maxIndicators) => {
minIndicators[option], scale(minIndicators[option]).hex(),
maxIndicators[option], scale(maxIndicators[option]).hex()
];
glmap.getMapboxMap().setPaintProperty(layer, "fill-color", color);
//glmap.getMapboxMap().setPaintProperty(layer, "fill-color", color);
});
return Promise.resolve(scale);
}
......@@ -736,20 +864,69 @@ let legend = L.control({
position: "bottomright"
});
legend.onAdd = () => {
legend.onAdd = function() {
let div = L.DomUtil.create("div", "info legend leaflet-bar");
let option = $("#indicatorSelect").val();
let optionIndex = indicators.indexOf(option);
let legendText = indicatorsUnits[optionIndex] == "" ? indicatorsNames[optionIndex] :
`${indicatorsNames[optionIndex]} (${indicatorsUnits[optionIndex]})`;
var html = `<h6>${legendText}</h6><ul>`;
let classes = scale.classes();
classes.forEach((c, idx, array) => {
//let legendText = indicatorsUnits[optionIndex] == "" ? indicatorsNames[optionIndex] :
// `${indicatorsNames[optionIndex]} (${indicatorsUnits[optionIndex]})`;
//title
let title = L.DomUtil.create("h6", "");
title.innerHTML = `${indicatorsShortNames[optionIndex]}`;
div.appendChild(title);
// list
let list = L.DomUtil.create("ul", "");
div.appendChild(list);
//var html = `<h6>${indicatorsShortNames[optionIndex]}</h6><ul>`;
//let domain =
//scale = chroma.scale("PuBu").padding([0.5, 0]).domain(domain).classes(5);
// data
let classes = intervals[option].classes;
//let classes = scale.classes();
/*classes.forEach((c, idx, array) => {
if (idx != array.length - 1) {
html += `<li><i style="background: ${scale(c).hex()}"></i>${d3.format(",.4~s")(classes[idx])} - ${d3.format(",.4~s")(classes[idx+1])}</li>`;
}
});*/
// create stuff for each type of flow
classes.forEach((c, idx) => {
// create list element
let item = L.DomUtil.create('li');
// create canvas element with arc of appropriate thickness ad color
let canvas = L.DomUtil.create('canvas');
let originProp = L.DomUtil.testProp(['transformOrigin', 'WebkitTransformOrigin', 'msTransformOrigin']);
canvas.style[originProp] = '50% 50%';
canvas.width = 18;
canvas.height = 18;
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(18, 18, 15, 1.5 * Math.PI, Math.PI, true);
ctx.lineWidth = intervals[option].thickness[idx];
ctx.lineCap = 'round';
// line color
ctx.strokeStyle = intervals[option].colors[idx];;
ctx.stroke();
// append canvas to list element
item.appendChild(canvas);
// create legend item text
let span = L.DomUtil.create("span", "legendItem");
span.innerText = c;
// append text to list item
item.appendChild(span)
// lastly, append item to list
list.appendChild(item);
});
html += "</ul>";
div.innerHTML = html;
return div;
};
\ No newline at end of file
/*
* Copyright 2020 - All rights reserved.
* Rodrigo Tapia-McClung
*
* August 2020
*/
/* globals Promise */
/* exported layerControl */
let timeDimensionControl,
map,
overlay,
glmap,
osmLayer, cartoLightLayer, cartoDarkLayer,
timeLayer,
layerControl,
tiles;
const getMinMax = table => {
return new Promise(resolve => {
//let table = "urbanization_year";
const baseUrl = new URL(`/data`, window.location.href).href;
let minmaxQuery = `${baseUrl}/query/${table}?columns=${`min(yeartrimes), max(yeartrimes)`}`;
d3.json(minmaxQuery).then(minmax => {
resolve(minmax[0]);
});
});
}
const setupMap = (dates) => {
return new Promise(resolve => {
// make body tag to have style height: 100%
$("body").css("height", "100%");
osmLayer = L.tileLayer("http://{s}.tile.osm.org/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "&copy; <a href=\"http://osm.org/copyright\" target=\"_blank\">OpenStreetMap</a> contributors"
});
cartoLightLayer = L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
});
cartoDarkLayer = L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/dark_all/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
});
//let bounds = cuencaBufferMask.getBounds();
let southWest = L.latLng(19.87, -102.87),
northEast = L.latLng(23.02, -99.31),
bounds = L.latLngBounds(southWest, northEast);
let datesArray = [dates.min, dates.max]; // [2014.2, 2019.4]
// convert year.Q dates array to initil and end Date object to explode in timeDimension
let times = datesArray.map( date => {
let q = (date - parseInt(date))*10;
return new Date(parseInt(date), parseInt(q*3-3), 1);
});
map = L.map("mexmap", {
//center: [17.22, -92.28],
minZoom: 8,
zoom: 6,
attributionControl: false,
timeDimension: true,
//timeDimensionControl: true,
timeDimensionOptions: {
times: L.TimeDimension.Util.explodeTimeRange(times[0], times[1], "P3M")
//currentTime: dates.min
},
maxBounds: bounds
}).setView([21.15, -100.94], 8);
cartoDarkLayer.addTo(map);
// set sync map on right
let osmLayerOverlay = L.tileLayer("http://{s}.tile.osm.org/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "&copy; <a href=\"http://osm.org/copyright\" target=\"_blank\">OpenStreetMap</a> contributors"
}),
cartoLightLayerOverlay = L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
}),
cartoDarkLayerOverlay = L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/dark_all/{z}/{x}/{y}.png", {
maxZoom: 19,
attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
});
overlay = L.map("overlaydiv", {
zoomControl: false,
inertia: false,
keyboard: false,
//dragging: false,
scrollWheelZoom: true,
attributionControl: false,
zoomAnimation: true
}).setView([16.96, -92.97], 8);
cartoDarkLayerOverlay.addTo(overlay);
L.control.attribution({ position: "bottomright" }).addTo(overlay);
// on base layer on main map, change base layer on overlay map
map.on("baselayerchange", event => {
overlay.eachLayer(l => overlay.removeLayer(l));
if (event.name == "Carto Dark") {
cartoDarkLayerOverlay.addTo(overlay);
} else if (event.name == "Carto Light") {
cartoLightLayerOverlay.addTo(overlay);
} else if (event.name == "OpenStreetMap") {
osmLayerOverlay.addTo(overlay);
}
});
const offsetGlobal = (center, zoom, refMap, tgtMap) => {
var refC = refMap.getContainer();
var tgtC = tgtMap.getContainer();
var pt = refMap.project(center, zoom)
.subtract([refC.offsetLeft, refC.offsetTop])
.subtract(refMap.getSize().divideBy(2))
.add([tgtC.offsetLeft, tgtC.offsetTop])
.add(tgtMap.getSize().divideBy(2));
return refMap.unproject(pt, zoom);
}
map.sync(overlay, { offsetFn: offsetGlobal });
resolve({ "map": map });
});
}
const populateMap = async(mapData) => {
tiles = mapboxLayer("urbanization_year");
let map = mapData.map;
glmap = L.mapboxGL({
accessToken: "no-token",
style: {
"version": 8,
"sources": {},
"layers": []
}
}).addTo(map);
// after mapboxGL map is ready with styles do this:
glmap.getMapboxMap().on("style.load", () => {
glmap.getMapboxMap().addLayer(tiles);
//glmap.getMapboxMap().setPaintProperty(tiles, "fill-opacity", 0.7)
timeDimensionControl.addTo(map);
// Pass dummy geojson layer to timeDimension in order to register and sync
timeLayer = L.timeDimension.layer.Tile(L.geoJSON(), {
updateTimeDimension: true,
updateTimeDimensionMode: "replace",
waitForReady: true,
duration: "P1M"
});
timeLayer.addTo(map);
let baseLayers = {
"Carto Dark": cartoDarkLayer,
"Carto Light": cartoLightLayer,
"OpenStreetMap": osmLayer
};
var overlays = {
// "<span id=\"cuencaOverlay\">Agua en la cuenca del Grijalva</span>": timeLayer
};
layerControl = L.control.layers(baseLayers, overlays).addTo(map);
//legend.addTo(map);
// fix for leaflet-mapbox-gl v. 0.0.11 that adds map's to tile pane:
// get children of map tile pane, create array from it and iterate
// setting their z-index
let glmapChildren = map.getPanes().tilePane.children,
children = Array.from(glmapChildren);
children.forEach( c => c.style.zIndex = "inherit" );
let legend = L.control({
position: "bottomright"
});
let years = [],
colors = [];
legend.onAdd = () => {
let div = L.DomUtil.create("div", "info legend leaflet-bar");
// get layer style from mapbox map
let layerStyle = glmap.getMapboxMap().getStyle().layers[0];
if (layerStyle.id == "urbanization_year") {
let paint = layerStyle.paint;
let legendStuff = paint["fill-color"].slice(3);
legendStuff.forEach(entry => {
if (typeof(entry) === "number") {
years.push(entry);
} else {
colors.push(entry);
}
});
}
//let html = `<div><h6>A&ntilde;o</h6></div><div class="colors", style="background: linear-gradient(to bottom, ${colors.join(",")})">`;
let html = "<div><h6>A&ntilde;o</h6></div><div class=\"colors\">";
// create legend items
years.forEach( y => {
html += `<div class="yearLegendItem">${y}</div>`;
});
html += "</div>";
div.innerHTML = html;
return div;
};
legend.addTo(map);
// once legend is added and divs exist, style background with color gradient
$(".colors").css({background: `linear-gradient(to bottom, ${colors.join(",")})`, width: "5px", marginRight: "35px"});
$(".yearLegendItem").css({paddingLeft: "10px"});
});
}
// define MVT layer for given table and all trimester column
const mapboxLayer = (table) => {
const baseUrl = new URL(`/data`, window.location.href).href;
let pbfLayer = {
id: table,
source: {
type: "vector",
tiles: [`${baseUrl}/${table}/mvt/{z}/{x}/{y}?geom_column=geom&columns=yeartrimes`],
maxzoom: 19,
minzoom: 6
},
"source-layer": table,
type: "fill",
"paint": {
"fill-opacity": 0.7,
"fill-color": [
"interpolate",
["linear"],
["get", "yeartrimes"],
2014, "rgb(49,54,149)",
2016, "rgb(255,255,191)",
2019, "rgb(158,1,66)"
/*2014, "rgba(0, 255, 0, 0.5)", // green
2019, "rgba(255, 0, 0, 0.5)", // red*/
],/*
"fill-outline-color": [
"interpolate",
["linear"],
["get", "df"],
1, "rgba(255, 0, 0, 0.6)", // red
1.3, "rgba(0, 255, 0, 0.6)", // green
]*/
}
}
/*currentTiles[monthYear] = pbfLayer;
allTiles[monthYear] = pbfLayer;*/
return pbfLayer;
}
const setupTimeDimensionControl = () => {
L.Control.TimeDimensionCustom = L.Control.TimeDimension.extend({
_getDisplayDateFormat: date => {
let d = new Date(date);
let year = d.getFullYear().toString();
let month = d.getUTCMonth();
return `Q${month/3+1} ${year}`;
}
});
timeDimensionControl = new L.Control.TimeDimensionCustom({
loopButton: true,
/*minSpeed: 1,
maxSpeed: 5,*/
timeSteps: 1,
playReverseButton: true,
//limitSliders: true,
playerOptions: {
//buffer: 5,
//minBufferReady: 5,
transitionTime: 125,
loop: true
},
timeZones: ["Local"]
});
}
L.TimeDimension.Layer.Tile = L.TimeDimension.Layer.extend({
_setAvailableTimes: function() {
if (this.options.times) {
return L.TimeDimension.Util.parseTimesExpression(this.options.times);
} else if (this.options.timeInterval) {
let tiArray = L.TimeDimension.Util.parseTimeInterval(this.options.timeInterval);
let period = this.options.period || "P1D";
let validTimeRange = this.options.validTimeRange || undefined;
//alert("times");
return L.TimeDimension.Util.explodeTimeRange(tiArray[0], tiArray[1], period, validTimeRange);
} else {
return [];
}
},
onAdd: function(map) {
// Don't call prototype so this_update() does not get called twice
//L.TimeDimension.Layer.prototype.onAdd.call(this, map);
this._map = map;
if (!this._timeDimension && map.timeDimension) {
this._timeDimension = map.timeDimension;
}
this._timeDimension.on("timeloading", this._onNewTimeLoading, this);
this._timeDimension.on("timeload", this._update, this);
this._timeDimension.registerSyncedLayer(this);
map.addLayer(this._baseLayer);
this._update();
},
onRemove: function(map) {
this._timeDimension.unregisterSyncedLayer(this);
this._timeDimension.off("timeloading", this._onNewTimeLoading, this);
this._timeDimension.off("timeload", this._update, this);
//this._baseLayer.getContainer().style.display = "none";
/*Object.keys(allTiles).forEach(layer => { // hide all tiles
glmap.getMapboxMap().setPaintProperty(layer, "fill-opacity", 0);
});*/
//this.eachLayer(map.removeLayer, map);
//this._map = null;
},
isReady: function(time) {
// to be implemented for each type of layer
return true;
},
_update: function() {
if (!this._baseLayer || !this._map) {
return;
}
var time = this._timeDimension.getCurrentTime();
//TODO: get current time, parse quarter and compare tile value. Incremental add over time
// get data for time
let d = new Date(time),
year = d.getFullYear().toString(),
m = d.getUTCMonth(),
yeartrimester = year + "." + (m / 3 + 1),
yearQ = `Q${m/3+1} ${year}`;
//month = monthArray[m].toLowerCase(),
//monthYear = `${month}_${year}`;
// Update title
let title = $("#title");
title.html(`<h2>Crecimiento urbano en la regi&oacute;n metropolitana centro pa&iacute;s en ${yearQ}</h2>`);
// styleTiles based on yeartrimester value
let filter = ["<=", ["get", "yeartrimes"], parseFloat(yeartrimester)];
glmap.getMapboxMap().setFilter("urbanization_year", filter);
}
});
L.timeDimension.layer.Tile = (layer, options) => {
return new L.TimeDimension.Layer.Tile(layer, options);
};
// hide initial screen and show map
$("#startHeader").remove();
$(".picker").remove();
$("#initial-backdrop").remove();
$("#mainContainer")[0].style.setProperty("display", "flex", "important");
$("#mexmap").show();
$("#odTableRow").removeClass("align-self-center");
$("#odCard").hide();
setupTimeDimensionControl();
getMinMax("urbanization_year") // get minmax year.Q values to popoulate timeDimension
.then(dates => setupMap(dates))
.then(map => populateMap(map));
\ No newline at end of file
/*
* Copyright 2020 - All rights reserved.
* Rodrigo Tapia-McClung
*
* June 2020
*/
/* globals am4core, am4charts, am4themes_animated, intervals*/
// amchart
am4core.ready(function() {
let mainTextColor = getComputedStyle(document.body).getPropertyValue('--main-text-color');
// bar and line chart
var chart = am4core.create("topChart", am4charts.XYChart);
let ctitle = chart.titles.create();
ctitle.text = "Área urbanizada trimestralmente";
ctitle.fontSize = 15;
//title.marginBottom = 30;
ctitle.fill = am4core.color(mainTextColor);
//Add data
const baseUrl = new URL(`/data`, window.location.href).href;
let table = "urbanization_year";
let query = `${baseUrl}/query/${table}?columns=yeartrimes,sum(area)/10000 as area,date&group=yeartrimes,date&sort=yeartrimes`;
d3.json(query).then(d => chart.data = d);
// Create axes
let xAxis = chart.xAxes.push(new am4charts.DateAxis());
xAxis.baseInterval = { timeUnit: "month", count: 3 };
xAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
xAxis.renderer.labels.template.fontSize = 15;
xAxis.renderer.labels.template.location = 0.5;
xAxis.tooltipDateFormat = "q yyyy";
xAxis.adapter.add("getTooltipText", (text) => {
return "Q" + text;
});
xAxis.dateFormats.setKey("month", "Qq yyyy");
xAxis.periodChangeDateFormats.setKey("month", "Qq yyyy");
let valueAxis1 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis1.title.text = "Área urbanizada (Ha)";
valueAxis1.title.fill = am4core.color(mainTextColor);
valueAxis1.min = valueAxis1.minZoomed;
valueAxis1.max = valueAxis1.maxZoomed;
valueAxis1.title.fill = am4core.color(mainTextColor);
valueAxis1.renderer.labels.template.fill = am4core.color(mainTextColor);
valueAxis1.fontSize = 15;
valueAxis1.renderer.labels.template.fontSize = 15;
valueAxis1.numberFormatter = new am4core.NumberFormatter();
valueAxis1.numberFormatter.numberFormat = "#,###";
/* let valueAxis2 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis2.title.text = "Cambio (Ha)"; //"Market Days";
valueAxis2.renderer.opposite = true;
//valueAxis2.axisRanges.value = 50
//valueAxis2.syncWithAxis = valueAxis1;
//valueAxis2.renderer.grid.template.disabled = true;
valueAxis2.numberFormatter.numberFormat = "#,###.0";
valueAxis2.title.fill = am4core.color(mainTextColor);
valueAxis2.renderer.labels.template.fill = am4core.color(mainTextColor);*/
let valueAxis3 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis3.title.text = "Cambio Porcentual (%)"; //"Market Days";
valueAxis3.renderer.opposite = true;
valueAxis3.numberFormatter.numberFormat = "#.#";
valueAxis3.renderer.labels.template.fill = am4core.color("#b9ce37");
valueAxis3.title.fill = am4core.color("#b9ce37");
//valueAxis3.min = -300;
valueAxis3.syncWithAxis = valueAxis1;
valueAxis3.fontSize = 15;
valueAxis3.renderer.labels.template.fontSize = 15;
valueAxis3.min = valueAxis3.minZoomed;
valueAxis3.max = valueAxis3.maxZoomed;
valueAxis3.numberFormatter = new am4core.NumberFormatter();
valueAxis3.numberFormatter.numberFormat = "#,###";
//valueAxis3.syncWithAxis = valueAxis1;
// Create series
let series1 = chart.series.push(new am4charts.ColumnSeries());
series1.dataFields.dateX = "date";
series1.dataFields.valueY = "area";
series1.name = "Área urbanizada";
series1.yAxes = valueAxis1;
//series1.tooltipText = "{name}\n{dateX}:\n[bold font-size: 20] {valueY}"; //"{name}\n[bold font-size: 20]{valueY}"; //M[/]";
// series1.tooltipText = "[bold font-size: 20]{name}\n[bold font-size: 20] {valueY.formatNumber('#,###.#')} Ha";
series1.fill = chart.colors.getIndex(0);
series1.strokeWidth = 0;
series1.clustered = false;
/*let series2 = chart.series.push(new am4charts.ColumnSeries());
series2.dataFields.dateX = "date";
series2.dataFields.valueY = "area";
series2.dataFields.valueYShow = "change";
series2.name = "Cambio";
series2.yAxis = valueAxis2;
series2.tooltipText = "[bold font-size: 20]{name}\n[bold font-size: 20]{valueY.change.formatNumber('#,###.#')} Ha[/]"; //M[/]";
series2.columns.template.width = am4core.percent(40);
series2.clustered = false;*/
let series3 = chart.series.push(new am4charts.LineSeries());
series3.dataFields.valueY = "area";
series3.dataFields.valueYShow = "previousChangePercent";
//series3.dataFields.valueX = "date";
series3.dataFields.dateX = "date";
series3.name = "Cambio Porcentual";
series3.strokeWidth = 2;
series3.tensionX = 0.7;
series3.stroke = am4core.color("#b9ce37");
series3.strokeDasharray = "3,3";
series3.yAxis = valueAxis3;
series3.tooltip.label.fontSize = 15;
series3.tooltipText = "[bold]Q{dateX.formatDate('q yyyy')}:[/]\nÁrea urbanizada: {valueY.formatNumber('#,###.##')} Ha\nCambio: {valueY.previousChange.formatNumber('#,###.##')} Ha\n{name}: {valueY.previousChangePercent.formatNumber('#,###.##')}\%";
series3.tooltip.getFillFromObject = false;
series3.tooltip.background.fill = am4core.color(mainTextColor);
//Add cursor
chart.cursor = new am4charts.XYCursor();
//Add legend
chart.legend = new am4charts.Legend();
chart.legend.position = "top";
chart.legend.fontSize = 15;
chart.legend.labels.template.fill = am4core.color(mainTextColor);
//Add scrollbar
// chart.legend.labels.template.fill = am4core.color(mainTextColor);
chart.scrollbarX = new am4charts.XYChartScrollbar();
// chart.scrollbarX.series.push(series3);
chart.scrollbarX.minHeight = 1;
//chart.scrollbarX.series.push(series3);
chart.scrollbarX.parent = chart.bottomAxesContainer;
// pie chart
let pchart = am4core.create("bottomLeftChart", am4charts.PieChart);
let query2 = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,DATE_PART('year',date) as yy&group=yy&sort=yy`; // &sort=yeartrimes`;
d3.json(query2).then(d => pchart.data = d);
let ptitle = pchart.titles.create();
ptitle.text = "Área urbanizada anualmente";
ptitle.fontSize = 15;
ptitle.marginTop = 30;
ptitle.fill = am4core.color(mainTextColor);
pchart.innerRadius = am4core.percent(40);
//Add legend
pchart.legend = new am4charts.Legend();
pchart.legend.position = "right";
pchart.legend.labels.template.fill = am4core.color(mainTextColor);
pchart.legend.valueLabels.template.fill = am4core.color(mainTextColor);
pchart.legend.fontSize = 15;
// Add and configure Series
let pieSeries = pchart.series.push(new am4charts.PieSeries());
pieSeries.dataFields.value = "area";
pieSeries.dataFields.category = "yy";
pieSeries.ticks.template.disabled = true;
//pieSeries.labels.template.disabled = true;
pieSeries.alignLabels = false;
pieSeries.labels.template.bent = true;
pieSeries.colors.list = [
am4core.color("#313695"),
am4core.color("#5e6bbf"),
am4core.color("#e0f3f8"),
am4core.color("#ffffbf"),
am4core.color("#b82a76"),
am4core.color("#9e0142")
];
pieSeries.slices.template.stroke = am4core.color("#ffffff");
pieSeries.slices.template.strokeWidth = 3;
pieSeries.slices.template.strokeOpacity = .20;
pieSeries.slices.template.tooltipText = "[bold]{category}:[/] {value.percent.formatNumber('#.#')}% ({value.value.formatNumber('#,###.##')} Ha)";
pieSeries.numberFormatter.numberFormat = "####.#";
pieSeries.labels.template.fill = am4core.color(mainTextColor);
pieSeries.labels.template.fontSize = 15;
pieSeries.labels.template.text = "{category}";
// radar chart
// Themes begin
am4core.useTheme(am4themes_animated);
// Themes end
var rchart = am4core.create("bottomRightChart", am4charts.RadarChart);
// chart.hiddenState.properties.opacity = 0; // this creates initial fade-in
//const baseUrl = new URL(`/data`, window.location.href).href;
//let table = "urbanization_year";
//let query = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,date,DATE_PART('month',date) as mm&group=mm,date &sort=mm`;
//let query = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,DATE_PART('month',date) as mm&group=mm &sort=mm`;
let query_r = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,DATE_PART('month',date) as mm,concat('Q', DATE_PART('quarter',date)::text) as qq&group=mm,qq &sort=mm`;
d3.json(query_r).then(d => rchart.data = d);
//chart.padding(20, 20, 20, 20);
rchart.innerRadius = am4core.percent(15);
rchart.radius = am4core.percent(90);
//chart.data = weeklyData;
rchart.fontSize = 12;
rchart.startAngle = 180;
rchart.endAngle = rchart.startAngle + 180;
// Create axes
// var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
var dateAxis = rchart.xAxes.push(new am4charts.CategoryAxis());
dateAxis.dataFields.category = "qq";
// dateAxis.baseInterval = { timeUnit: "month", count: 3 };
//dateAxis.renderer.innerRadius = am4core.percent(40);
dateAxis.renderer.minGridDistance = 5;
dateAxis.renderer.labels.template.relativeRotation = 0;
dateAxis.renderer.labels.template.location = 0.5;
dateAxis.renderer.labels.template.radius = am4core.percent(-57);
dateAxis.renderer.labels.template.fontSize = 12;
dateAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
dateAxis.cursorTooltipEnabled = false;
// dateAxis.calculateTotals = true;
var valueAxis = rchart.yAxes.push(new am4charts.ValueAxis());
valueAxis.renderer.inversed = true;
valueAxis.renderer.radius = am4core.percent(40);
valueAxis.renderer.minGridDistance = 15;
valueAxis.renderer.minLabelPosition = 0.05;
//valueAxis.renderer.axisAngle = 90;
valueAxis.renderer.axisAngle = 270;
valueAxis.cursorTooltipEnabled = false;
valueAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
valueAxis.renderer.grid.template.stroke = am4core.color(mainTextColor);
// valueAxis.calculateTotals = true;
//Add series
var columnSeries = rchart.series.push(new am4charts.RadarColumnSeries());
// columnSeries.dataFields.dateX = "date";
columnSeries.dataFields.categoryX = "qq"; //date
columnSeries.dataFields.valueY = "area";
// columnSeries.dataFields.valueYShow = "sum";
columnSeries.columns.template.strokeOpacity = 0;
columnSeries.columns.template.width = am4core.percent(95);
columnSeries.fill = am4core.color("#80acba");
columnSeries.fillOpacity = 0.6;
columnSeries.tooltip.fontSize = 15;
columnSeries.tooltip.pointerOrientation = "down";
columnSeries.tooltip.background.fillOpacity = 0.5;
columnSeries.columns.template.tooltipText = "[bold]{qq}[/]\nTotal {valueY.formatNumber('#,###.##')} Ha";
columnSeries.cursorTooltipEnabled = false;
//columnSeries.yAxis = dateAxis;
/* //ANILLO EXTERIOR
var range = dateAxis.axisRanges.create();
range.category = "January";
range.endCategory = "April";
range.axisFill.fill = am4core.color("#396478");
range.axisFill.fillOpacity = 0.3;*/
let yearsAxis = rchart.yAxes.push(new am4charts.CategoryAxis());
let bubbleSeries = rchart.series.push(new am4charts.RadarSeries());
//let queryYYYY = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,DATE_PART('month',date) as mm,DATE_PART('year',date) as yy,date&group=yy,mm,date &sort=yy,mm`;
let queryYYYY = `${baseUrl}/query/${table}?columns=sum(area)/10000 as area,to_char(to_timestamp (date_part('month', date)::text, 'MM'), 'Month') as mm,DATE_PART('year',date) as yy,concat('Q', DATE_PART('quarter',date)::text) as qq,date&group=qq,yy,mm,date &sort=date`;
d3.json(queryYYYY).then(d => {
yearsAxis.data = d
bubbleSeries.data = d;
});
// weekday axis
//var weekDayAxis = chart.yAxes.push(new am4charts.CategoryAxis());
yearsAxis.dataFields.category = "yy";
//yearsAxis.data = dailyData;
yearsAxis.renderer.innerRadius = am4core.percent(50);
yearsAxis.renderer.minGridDistance = 10;
yearsAxis.renderer.grid.template.location = 0;
yearsAxis.renderer.grid.template.stroke = am4core.color(mainTextColor);
yearsAxis.renderer.line.disabled = true;
yearsAxis.renderer.axisAngle = 270;
yearsAxis.cursorTooltipEnabled = false;
yearsAxis.renderer.labels.template.fill = am4core.color(mainTextColor);
yearsAxis.numberFormatter = new am4core.NumberFormatter();
yearsAxis.numberFormatter.numberFormat = "####";
// bubble series
//var bubbleSeries = chart.series.push(new am4charts.RadarSeries());
bubbleSeries.dataFields.categoryX = "qq";
bubbleSeries.dataFields.categoryY = "yy";
bubbleSeries.dataFields.value = "area";
bubbleSeries.yAxis = yearsAxis;
//bubbleSeries.data = dailyData;
bubbleSeries.strokeOpacity = 0;
bubbleSeries.maskBullets = false;
bubbleSeries.cursorTooltipEnabled = false;
bubbleSeries.tooltip.fontSize = 15;
bubbleSeries.tooltip.pointerOrientation = "down";
bubbleSeries.tooltip.background.fillOpacity = 0.5;
bubbleSeries.dataItems.template.locations.categoryX = 0.5;
var bubbleBullet = bubbleSeries.bullets.push(new am4charts.CircleBullet())
bubbleBullet.locationX = 0.5;
bubbleBullet.stroke = am4core.color("#b9ce37");
bubbleBullet.fill = am4core.color("#b9ce37");
bubbleBullet.tooltipText = "[bold]Q{date.formatDate('q yyyy')}:[/] \n{value.formatNumber('#,###.0')} Ha";
bubbleBullet.adapter.add("tooltipY", function(tooltipY, target) {
return -target.circle.radius;
})
bubbleSeries.heatRules.push({ target: bubbleBullet.circle, min: 2, max: 12, dataField: "value", property: "radius" });
bubbleSeries.dataItems.template.locations.categoryY = 0.5;
// TITULOS MISCELANEOS
rchart.cursor = new am4charts.RadarCursor();
rchart.cursor.innerRadius = am4core.percent(40);
rchart.cursor.lineY.disabled = true;
var label = rchart.radarContainer.createChild(am4core.Label);
label.horizontalCenter = "middle";
label.verticalCenter = "middle";
label.fill = am4core.color(mainTextColor);
label.fontSize = 13;
//label.fontWeight = "bold";
label.text = "TOTAL\nTRIMESTRAL";
var title = rchart.createChild(am4core.Label);
title.fill = am4core.color("#b9ce37");
title.fontSize = 15;
title.isMeasured = false;
title.valign = "top";
title.align = "left";
title.wrap = true;
title.width = 200;
title.text = "[bold]Área urbanizada entre 2014 y 2019.\n[font-size:11; #ffffff] Cada círculo representa el tamaño del área urbanizada.";
}); // end am4core.ready()
\ No newline at end of file
......@@ -455,7 +455,7 @@ const populateMap = async (mapData) => {
// setting their z-index
let glmapChildren = map.getPanes().tilePane.children,
children = Array.from(glmapChildren);
children.forEach( c => c.style.zIndex = 'inherit' );
children.forEach( c => c.style.zIndex = "inherit" );
});
}
......
......@@ -455,7 +455,7 @@ const populateMap = async (mapData) => {
// setting their z-index
let glmapChildren = map.getPanes().tilePane.children,
children = Array.from(glmapChildren);
children.forEach( c => c.style.zIndex = 'inherit' );
children.forEach( c => c.style.zIndex = "inherit" );
});
}
......
......@@ -2,27 +2,25 @@
<html>
<head>
<meta charset='utf-8' />
<meta charset="utf-8" />
<title>Contenido de agua en la cuenca Grijalva</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" />
<link rel="stylesheet" href="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.control.min.css" />
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css' rel='stylesheet' />
<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="../js/L.VisualClick/L.VisualClick.css">
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css" />
<link rel="stylesheet" href="../js//Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.css">
<link rel="stylesheet" href="../js/L.VisualClick/L.VisualClick.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css" />
<link rel="stylesheet" type="text/css" href="../css/riesgos/style.css">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="icon" href="../img/grijalva.png" sizes="16x16">
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="../css/fontawesome.css" />
<link rel="icon" href="../img/risk.png" sizes="16x16">
</head>
<body>
<div id="initial-backdrop">
<img class="img_bg" src="../img/DSC_0716.jpg" alt="Afectaci&oacute;n por inundaci&oacute;n">
<img class="img_bg" src="../img/inundacion2.jpg" alt="Afectaci&oacute;n por inundaci&oacute;n">
<span class="photo-credit">Foto: Gabriela L&oacute;pez </span>
</div>
<div class="container" id="startHeader">
......@@ -133,22 +131,21 @@
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"></script>
<script src="../js/Leaflet.BeautifyIcon/leaflet-beautify-marker-icon.js"></script>
<script src="../js/L.VisualClick/L.VisualClick.js"></script>
<script src="https://api.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.3.1/leaflet-omnivore.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdn.rawgit.com/nezasa/iso8601-js-period/master/iso8601.min.js"></script>
<script src="https://cdn.rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/2.0.3/chroma.min.js"></script>
<script src="https://d3js.org/d3.v5.min.js"></script>
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js'></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js"></script>
<script src="https://unpkg.com/mapbox-gl-leaflet/leaflet-mapbox-gl.js"></script>
<script type="text/javascript" src="../js/Leaflet.Sync.js"></script>
<script src="../js/Leaflet.Sync.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script type="text/javascript" src="../js/jszip.min.js"></script>
<script src="../js/jszip.min.js"></script>
<script src="../js/riesgos_functions.js"></script>
<script src="../js/riesgos_basemap.js"></script>
<script src="../js/grijalva_charts.js"></script>
......
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