Skip to content

F
fordecyt_2019
Commit 23d671cf authored by Rodrigo Tapia-McClung's avatar Rodrigo Tapia-McClung
Browse files
Options

Testing first flowmaps

parent f7d924f2
Expand all Show whitespace changes
Inline Side-by-side
Showing with 989 additions and 112 deletions
public/centropais/data/viajes_ocupados_desde.json 0 → 100644
View file @ 23d671cf
{
"type": "FeatureCollection",
"name": "desde",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "id_orig": 11007, "muni_origen": "Celaya", "xo": -100.78786496799999, "yo": 20.537565599299999, "ocupados": "Terciario", "viajes": 578, "id_dest": 11017, "muni_destino": null, "xd": -101.368320763, "yd": 20.699813496699999, "personas": 578 }, "geometry": { "type": "Point", "coordinates": [ -100.78786496799999, 20.537565599299999 ] } },
{ "type": "Feature", "properties": { "id_orig": 11007, "muni_origen": "Celaya", "xo": -100.78786496799999, "yo": 20.537565599299999, "ocupados": "Terciario", "viajes": 623, "id_dest": 11027, "muni_destino": null, "xd": -101.165096104, "yd": 20.625110122500001, "personas": 623 }, "geometry": { "type": "Point", "coordinates": [ -100.78786496799999, 20.537565599299999 ] } },
{ "type": "Feature", "properties": { "id_orig": 11020, "muni_origen": "León", "xo": -101.622402619, "yo": 21.124749248400001, "ocupados": "Primario", "viajes": 643, "id_dest": 11017, "muni_destino": null, "xd": -101.368320763, "yd": 20.699813496699999, "personas": 643 }, "geometry": { "type": "Point", "coordinates": [ -101.622402619, 21.124749248400001 ] } },
{ "type": "Feature", "properties": { "id_orig": 11007, "muni_origen": "Celaya", "xo": -100.78786496799999, "yo": 20.537565599299999, "ocupados": "Terciario", "viajes": 660, "id_dest": 11011, "muni_destino": "Cortazar", "xd": -100.938370267, "yd": 20.429113635299998, "personas": 660 }, "geometry": { "type": "Point", "coordinates": [ -100.78786496799999, 20.537565599299999 ] } },
{ "type": "Feature", "properties": { "id_orig": 22014, "muni_origen": "Querétaro", "xo": -100.452710294, "yo": 20.7288053752, "ocupados": "Primario", "viajes": 695, "id_dest": 11015, "muni_destino": "Guanajuato", "xd": -101.23732891900001, "yd": 21.018454309199999, "personas": 695 }, "geometry": { "type": "Point", "coordinates": [ -100.452710294, 20.7288053752 ] } },
{ "type": "Feature", "properties": { "id_orig": 11017, "muni_origen": "Irapuato", "xo": -101.368320763, "yo": 20.699813496699999, "ocupados": "Terciario", "viajes": 729, "id_dest": 11020, "muni_destino": null, "xd": -101.622402619, "yd": 21.124749248400001, "personas": 729 }, "geometry": { "type": "Point", "coordinates": [ -101.368320763, 20.699813496699999 ] } },
{ "type": "Feature", "properties": { "id_orig": 11007, "muni_origen": "Celaya", "xo": -100.78786496799999, "yo": 20.537565599299999, "ocupados": "Terciario", "viajes": 731, "id_dest": 11044, "muni_destino": "Villagrán", "xd": -100.992512401, "yd": 20.541961899299999, "personas": 731 }, "geometry": { "type": "Point", "coordinates": [ -100.78786496799999, 20.537565599299999 ] } },
{ "type": "Feature", "properties": { "id_orig": 22014, "muni_origen": "Querétaro", "xo": -100.452710294, "yo": 20.7288053752, "ocupados": "Primario", "viajes": 802, "id_dest": 22016, "muni_destino": "San Juan del Rí­o", "xd": -100.00038001, "yd": 20.368911535500001, "personas": 802 }, "geometry": { "type": "Point", "coordinates": [ -100.452710294, 20.7288053752 ] } },
{ "type": "Feature", "properties": { "id_orig": 11017, "muni_origen": "Irapuato", "xo": -101.368320763, "yo": 20.699813496699999, "ocupados": "Terciario", "viajes": 807, "id_dest": 11015, "muni_destino": null, "xd": -101.23732891900001, "yd": 21.018454309199999, "personas": 807 }, "geometry": { "type": "Point", "coordinates": [ -101.368320763, 20.699813496699999 ] } },
{ "type": "Feature", "properties": { "id_orig": 11020, "muni_origen": "León", "xo": -101.622402619, "yo": 21.124749248400001, "ocupados": "Primario", "viajes": 1286, "id_dest": 11015, "muni_destino": null, "xd": -101.23732891900001, "yd": 21.018454309199999, "personas": 1286 }, "geometry": { "type": "Point", "coordinates": [ -101.622402619, 21.124749248400001 ] } },
{ "type": "Feature", "properties": { "id_orig": 11007, "muni_origen": "Celaya", "xo": -100.78786496799999, "yo": 20.537565599299999, "ocupados": "Terciario", "viajes": 1301, "id_dest": 22014, "muni_destino": null, "xd": -100.452710294, "yd": 20.7288053752, "personas": 1301 }, "geometry": { "type": "Point", "coordinates": [ -100.78786496799999, 20.537565599299999 ] } },
{ "type": "Feature", "properties": { "id_orig": 22014, "muni_origen": "Querétaro", "xo": -100.452710294, "yo": 20.7288053752, "ocupados": "Primario", "viajes": 2247, "id_dest": 22006, "muni_destino": "Corregidora", "xd": -100.441074888, "yd": 20.485442072800002, "personas": 2247 }, "geometry": { "type": "Point", "coordinates": [ -100.452710294, 20.7288053752 ] } },
{ "type": "Feature", "properties": { "id_orig": 11020, "muni_origen": "León", "xo": -101.622402619, "yo": 21.124749248400001, "ocupados": "Primario", "viajes": 2635, "id_dest": 11031, "muni_destino": "San Francisco del Rincón", "xd": -101.78851964499999, "yd": 20.919124081100001, "personas": 2635 }, "geometry": { "type": "Point", "coordinates": [ -101.622402619, 21.124749248400001 ] } },
{ "type": "Feature", "properties": { "id_orig": 11017, "muni_origen": "Irapuato", "xo": -101.368320763, "yo": 20.699813496699999, "ocupados": "Terciario", "viajes": 3079, "id_dest": 11027, "muni_destino": "Salamanca", "xd": -101.165096104, "yd": 20.625110122500001, "personas": 3079 }, "geometry": { "type": "Point", "coordinates": [ -101.368320763, 20.699813496699999 ] } },
{ "type": "Feature", "properties": { "id_orig": 24028, "muni_origen": "San Luis Potosí", "xo": -100.96088844000001, "yo": 22.270479009100001, "ocupados": "Secundario", "viajes": 3179, "id_dest": 24035, "muni_destino": "Soledad de Graciano Sánchez", "xd": -100.85513169799999, "yd": 22.2716259147, "personas": 3179 }, "geometry": { "type": "Point", "coordinates": [ -100.96088844, 22.270479009100001 ] } },
{ "type": "Feature", "properties": { "id_orig": 1001, "muni_origen": "Aguascalientes", "xo": -102.29580290200001, "yo": 21.811436231199998, "ocupados": "Secundario", "viajes": 3201, "id_dest": 1011, "muni_destino": "San Francisco de los Romo", "xd": -102.22902138400001, "yd": 22.03307051, "personas": 3201 }, "geometry": { "type": "Point", "coordinates": [ -102.295802902, 21.811436231199998 ] } },
{ "type": "Feature", "properties": { "id_orig": 1001, "muni_origen": "Aguascalientes", "xo": -102.29580290200001, "yo": 21.811436231199998, "ocupados": "Secundario", "viajes": 3322, "id_dest": 1005, "muni_destino": "Jesús María", "xd": -102.44564926, "yd": 21.932117505499999, "personas": 3322 }, "geometry": { "type": "Point", "coordinates": [ -102.295802902, 21.811436231199998 ] } },
{ "type": "Feature", "properties": { "id_orig": 11020, "muni_origen": "León", "xo": -101.622402619, "yo": 21.124749248400001, "ocupados": "Primario", "viajes": 4180, "id_dest": 11037, "muni_destino": null, "xd": -101.43778362899999, "yd": 20.963115350199999, "personas": 4180 }, "geometry": { "type": "Point", "coordinates": [ -101.622402619, 21.124749248400001 ] } },
{ "type": "Feature", "properties": { "id_orig": 22014, "muni_origen": "Querétaro", "xo": -100.452710294, "yo": 20.7288053752, "ocupados": "Primario", "viajes": 4226, "id_dest": 22011, "muni_destino": "El Marqués", "xd": -100.278617514, "yd": 20.720228286200001, "personas": 4226 }, "geometry": { "type": "Point", "coordinates": [ -100.452710294, 20.7288053752 ] } },
{ "type": "Feature", "properties": { "id_orig": 11017, "muni_origen": "Irapuato", "xo": -101.368320763, "yo": 20.699813496699999, "ocupados": "Terciario", "viajes": 7164, "id_dest": 11037, "muni_destino": "Silao", "xd": -101.43778362899999, "yd": 20.963115350199999, "personas": 7164 }, "geometry": { "type": "Point", "coordinates": [ -101.368320763, 20.699813496699999 ] } }
]
}
public/centropais/index.html
View file @ 23d671cf
......@@ -151,6 +151,10 @@
<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>
<!-- 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>
<script src="../js/centropais_functions.js"></script>
<script src="../js/centropais_basemap.js"></script>
<script src="../js/grijalva_charts.js"></script>
......
public/js/CanvasFlowmapLayer.js 0 → 100644
View file @ 23d671cf
This diff is collapsed.
public/js/centropais_basemap.js
View file @ 23d671cf
......@@ -955,6 +955,138 @@ const makeBaseMap = () => {
layerControl.addOverlay(layer_limiteMunicipal, "<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=c101&format=image/png&STYLE=default\" alt=\"Límite municipal\"/>");
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\"/>");
$.getJSON('data/viajes_ocupados_desde.json', data => {
let flowMapLayer = L.canvasFlowmapLayer(data, {
// Define origins and destination from json values
originAndDestinationFieldIds: {
originUniqueIdField: 'id_orig',
originGeometry: {
x: 'xo',
y: 'yo'
},
destinationUniqueIdField: 'id_dest',
destinationGeometry: {
x: 'xd',
y: 'yd'
}
},
// Line styles
canvasBezierStyle: {
type: 'classBreaks',
field: 'viajes',
classBreakInfos: [{
classMinValue: 0,
classMaxValue: 1000,
symbol: {
strokeStyle: '#00c5ff',
lineWidth: 0.5,
lineCap: 'round',
shadowColor: '#00c5ff',
shadowBlur: 1.5
}
}, {
classMinValue: 1001,
classMaxValue: 2000,
symbol: {
strokeStyle: '#008fdc',
lineWidth: 1.5,
lineCap: 'round',
shadowColor: '#008fdc',
shadowBlur: 1.5
}
}, {
classMinValue: 2001,
classMaxValue: 6000,
symbol: {
strokeStyle: '#005ce6',
lineWidth: 2,
lineCap: 'round',
shadowColor: '#005ce6',
shadowBlur: 1.5
}
}, {
classMinValue: 6001,
classMaxValue: 7200,
symbol: {
strokeStyle: '#4c0073',
lineWidth: 10,
lineCap: 'round',
shadowColor: '#4c0073',
shadowBlur: 1.5
}
}]
},
// Animated line styles
animatedCanvasBezierStyle: {
type: 'classBreaks',
field: 'viajes',
classBreakInfos: [{
classMinValue: 0,
classMaxValue: 1000,
symbol: {
strokeStyle: '#00c5ff',
lineWidth: 0.5,
lineDashOffsetSize: 4,
lineCap: 'round',
shadowColor: '#00c5ff',
shadowBlur: 1.5
}
}, {
classMinValue: 1001,
classMaxValue: 2000,
symbol: {
strokeStyle: '#008fdc',
lineWidth: 1.5,
lineDashOffsetSize: 4,
lineCap: 'round',
shadowColor: '#008fdc',
shadowBlur: 1.5
}
}, {
classMinValue: 2001,
classMaxValue: 6000,
symbol: {
strokeStyle: '#005ce6',
lineWidth: 4,
lineDashOffsetSize: 4,
lineCap: 'round',
shadowColor: '#005ce6',
shadowBlur: 1.5
}
}, {
classMinValue: 6001,
classMaxValue: 7200,
symbol: {
strokeStyle: '#4c0073',
lineWidth: 15,
lineDashOffsetSize: 4,
lineCap: 'round',
shadowColor: '#4c0073',
shadowBlur: 1.5
}
}]
},
// some custom options
pathDisplayMode: 'all',
animationStarted: true,
//animationEasingFamily: 'Cubic',
//animationEasingType: 'In',
animationEasingFamily: 'Linear',
animationEasingType: 'None',
animationDuration: 2000
});
flowMapLayer.addTo(map);
// Define what happens when user clicks dots
flowMapLayer.on('click', e => {
if (e.sharedOriginFeatures.length) {
flowMapLayer.selectFeaturesForPathDisplay(e.sharedOriginFeatures, 'SELECTION_NEW');
}
if (e.sharedDestinationFeatures.length) {
flowMapLayer.selectFeaturesForPathDisplay(e.sharedDestinationFeatures, 'SELECTION_NEW');
}
});
});
// Localize Leaflet.Draw texts
L.drawLocal = {
......
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