Skip to content

F
fordecyt_2019
Commit 9ee01644 authored by Rodrigo Tapia-McClung's avatar Rodrigo Tapia-McClung
Browse files
Options

Comment grijalva DB calls

parent 7423d8cc
Hide whitespace changes
Inline Side-by-side
Showing with 126 additions and 109 deletions
public/fordecyt_2019/js/centropais_basemap.js
View file @ 9ee01644
...@@ -248,7 +248,7 @@ let layer_auto2010 = new L.geoJson(null, { ...@@ -248,7 +248,7 @@ let layer_auto2010 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -277,7 +277,7 @@ let layer_auto2014 = new L.geoJson(null, { ...@@ -277,7 +277,7 @@ let layer_auto2014 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -306,7 +306,7 @@ let layer_auto2018 = new L.geoJson(null, { ...@@ -306,7 +306,7 @@ let layer_auto2018 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -335,7 +335,7 @@ let layer_tecnologia2010 = new L.geoJson(null, { ...@@ -335,7 +335,7 @@ let layer_tecnologia2010 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -364,7 +364,7 @@ let layer_tecnologia2014 = new L.geoJson(null, { ...@@ -364,7 +364,7 @@ let layer_tecnologia2014 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -393,7 +393,7 @@ let layer_tecnologia2018 = new L.geoJson(null, { ...@@ -393,7 +393,7 @@ let layer_tecnologia2018 = new L.geoJson(null, {
borderWidth: 0, borderWidth: 0,
borderColor: "transparent", borderColor: "transparent",
backgroundColor: "transparent" //, backgroundColor: "transparent" //,
// textColor: "#C0C0C0" // textColor: "#C0C0C0"
}); });
return new L.Marker(latlng, { return new L.Marker(latlng, {
icon: autoMarker icon: autoMarker
...@@ -889,113 +889,113 @@ const makeBaseMap = () => { ...@@ -889,113 +889,113 @@ const makeBaseMap = () => {
// Localize Leaflet.Draw texts // Localize Leaflet.Draw texts
L.drawLocal = { L.drawLocal = {
draw: { draw: {
toolbar: { toolbar: {
actions: { actions: {
title: "Cancelar dibujo", title: "Cancelar dibujo",
text: "Cancelar" text: "Cancelar"
}, },
finish: { finish: {
title: "Terminar dibujo", title: "Terminar dibujo",
text: "Terminar" text: "Terminar"
}, },
undo: { undo: {
title: "Eliminar último punto dibujado", title: "Eliminar último punto dibujado",
text: "Eliminar último punto" text: "Eliminar último punto"
},
buttons: {
polyline: "Dibujar una polilínea",
polygon: "Dibujar un polígono",
rectangle: "Dibujar un rectángulo",
circle: "Dibujar un círculo",
marker: "Dibujar un marcador",
circlemarker: "Dibujar un marcador circular"
}
},
handlers: {
circle: {
tooltip: {
start: "Haz click y arrastra para dibujar un círculo"
}, },
buttons: { radius: "Radio"
polyline: "Dibujar una polilínea", },
polygon: "Dibujar un polígono", circlemarker: {
rectangle: "Dibujar un rectángulo", tooltip: {
circle: "Dibujar un círculo", start: "Haz click en el mapa para ubicar el marcador circular"
marker: "Dibujar un marcador",
circlemarker: "Dibujar un marcador circular"
} }
}, },
handlers: { marker: {
circle: { tooltip: {
tooltip: { start: "Haz click en el mapa para ubicar el marcador"
start: "Haz click y arrastra para dibujar un círculo" }
}, },
radius: "Radio" polygon: {
}, error: "<strong>Error:</strong>",
circlemarker: { tooltip: {
tooltip: { start: "Haz click para empezar a dibujar la figura",
start: "Haz click en el mapa para ubicar el marcador circular" cont: "Haz click para continuar dibujando la figura",
} end: "Haz click en el primer punto para cerrar la figura"
}, }
marker: { },
tooltip: { polyline: {
start: "Haz click en el mapa para ubicar el marcador" error: "<strong>Error:</strong> las líneas no deben cruzarse",
} tooltip: {
}, start: "Haz click para empezar a dibujar la línea",
polygon: { cont: "Haz click para continuar dibujando la línea",
error: "<strong>Error:</strong>", end: "Haz click en el último punto para terminar la línea"
tooltip: { }
start: "Haz click para empezar a dibujar la figura", },
cont: "Haz click para continuar dibujando la figura", rectangle: {
end: "Haz click en el primer punto para cerrar la figura" tooltip: {
} start: "Haz click y arrastra para dibujar un rectángulo"
}, }
polyline: { },
error: "<strong>Error:</strong> las líneas no deben cruzarse", simpleshape: {
tooltip: { tooltip: {
start: "Haz click para empezar a dibujar la línea", end: "Suelta el ratón para terminar de dibujar"
cont: "Haz click para continuar dibujando la línea", }
end: "Haz click en el último punto para terminar la línea" }
} }
},
edit: {
toolbar: {
actions: {
save: {
title: "Guardar los cambios",
text: "Guardar"
}, },
rectangle: { cancel: {
tooltip: { title: "Cancelar la edición, descarta todos los cambios",
start: "Haz click y arrastra para dibujar un rectángulo" text: "Cancelar"
}
}, },
simpleshape: { clearAll: {
tooltip: { title: "Limpiar todas las capas",
end: "Suelta el ratón para terminar de dibujar" text: "Limpiar todo"
}
} }
},
buttons: {
edit: "Editar capas",
editDisabled: "No hay capas que editar",
remove: "Eliminar capas",
removeDisabled: "No hay capas que eliminar"
} }
}, },
edit: { handlers: {
toolbar: { edit: {
actions: { tooltip: {
save: { text: "Arrastra el marcador para editar la figura",
title: "Guardar los cambios", subtext: "Haz click en cancelar para deshacer los cambios"
text: "Guardar"
},
cancel: {
title: "Cancelar la edición, descarta todos los cambios",
text: "Cancelar"
},
clearAll: {
title: "Limpiar todas las capas",
text: "Limpiar todo"
}
},
buttons: {
edit: "Editar capas",
editDisabled: "No hay capas que editar",
remove: "Eliminar capas",
removeDisabled: "No hay capas que eliminar"
} }
}, },
handlers: { remove: {
edit: { tooltip: {
tooltip: { text: "Haz click en una figura para eliminarla"
text: "Arrastra el marcador para editar la figura",
subtext: "Haz click en cancelar para deshacer los cambios"
}
},
remove: {
tooltip: {
text: "Haz click en una figura para eliminarla"
}
} }
} }
} }
} }
// leaflet draw control }
// leaflet draw control
drawnItems = L.featureGroup().addTo(map); drawnItems = L.featureGroup().addTo(map);
let drawControl = new L.Control.Draw({ let drawControl = new L.Control.Draw({
......
public/fordecyt_2019/js/centropais_functions.js
View file @ 9ee01644
...@@ -85,6 +85,7 @@ d3.json("https://unpkg.com/d3-time-format@2.1.1/locale/es-MX.json").then(locale ...@@ -85,6 +85,7 @@ d3.json("https://unpkg.com/d3-time-format@2.1.1/locale/es-MX.json").then(locale
timeFormat = d3.timeFormat("%B_%Y"); timeFormat = d3.timeFormat("%B_%Y");
setupTimeDimensionControl(); setupTimeDimensionControl();
// FIX: Need to remove setup and populate dates and only setup and populate map
setupDates() setupDates()
.then(dates => populateDates(dates)) .then(dates => populateDates(dates))
.then(userData => setupMap(userData)) .then(userData => setupMap(userData))
...@@ -308,7 +309,8 @@ const setupMap = (dates) => { ...@@ -308,7 +309,8 @@ const setupMap = (dates) => {
//console.log(userFiles); //console.log(userFiles);
// query db to get min/max values per month and indicator and store them in an object // query db to get min/max values per month and indicator and store them in an object
queryFiles().then(minmax => { // FIX: comment out to avoid DB calls
/*queryFiles().then(minmax => {
minmax.map(minmaxMonth => { minmax.map(minmaxMonth => {
indicators.forEach((indicator) => { indicators.forEach((indicator) => {
minIndicators[indicator] = Math.min(minIndicators[indicator], minmaxMonth[`min${indicator}`]); minIndicators[indicator] = Math.min(minIndicators[indicator], minmaxMonth[`min${indicator}`]);
...@@ -316,7 +318,9 @@ const setupMap = (dates) => { ...@@ -316,7 +318,9 @@ const setupMap = (dates) => {
}); });
}); });
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators }); resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
}); });*/
// FIX: resolve with fake values
resolve({ "map": map, "minIndicators": minIndicators, "maxIndicators": maxIndicators });
}); });
} }
...@@ -342,7 +346,14 @@ const getMinMax = table => { ...@@ -342,7 +346,14 @@ const getMinMax = table => {
const populateMap = async(mapData) => { const populateMap = async(mapData) => {
const chartData = await getData(); // FIX: comment out to avoid DB calls
//const chartData = await getData();
// fake null data to avoid DB requests
chartData = [];
indicators.map( indicator => {
chartData[indicator] = [];
chartData[indicator].push({name: `${indicator}0`, values: [{"date": new Date("2016-01-01T06:00:00.000Z"),"value":0}]});
})
// Define charts with reusable components // Define charts with reusable components
indicators.map(async(indicator, index) => { indicators.map(async(indicator, index) => {
...@@ -397,10 +408,11 @@ const populateMap = async(mapData) => { ...@@ -397,10 +408,11 @@ const populateMap = async(mapData) => {
//map.createPane("wb-Tiles"); //map.createPane("wb-Tiles");
//map.getPane("wb-Tiles").style.zIndex = 450; //map.getPane("wb-Tiles").style.zIndex = 450;
// FIX: comment out to avoid DB calls
// create mvt layers // create mvt layers
userFiles.forEach(f => { /*userFiles.forEach(f => {
f = mapboxLayer(f); f = mapboxLayer(f);
}); });*/
glmap = L.mapboxGL({ glmap = L.mapboxGL({
accessToken: "no-token", accessToken: "no-token",
...@@ -413,7 +425,8 @@ const populateMap = async(mapData) => { ...@@ -413,7 +425,8 @@ const populateMap = async(mapData) => {
// after mapboxGL map is ready with styles do this: // after mapboxGL map is ready with styles do this:
glmap.getMapboxMap().on("style.load", () => { glmap.getMapboxMap().on("style.load", () => {
userFiles.forEach(monthYear => { // FIX: comment out to avoid DB calls
/*userFiles.forEach(monthYear => {
glmap.getMapboxMap().addLayer(currentTiles[monthYear]); glmap.getMapboxMap().addLayer(currentTiles[monthYear]);
}); });
...@@ -421,7 +434,7 @@ const populateMap = async(mapData) => { ...@@ -421,7 +434,7 @@ const populateMap = async(mapData) => {
if (layer == userFiles[0]) { if (layer == userFiles[0]) {
glmap.getMapboxMap().setPaintProperty(layer, "fill-opacity", 0.7) glmap.getMapboxMap().setPaintProperty(layer, "fill-opacity", 0.7)
} }
}); });*/
timeDimensionControl.addTo(map); timeDimensionControl.addTo(map);
// Pass dummy geojson layer to timeDimension in order to register and sync // Pass dummy geojson layer to timeDimension in order to register and sync
...@@ -433,10 +446,12 @@ const populateMap = async(mapData) => { ...@@ -433,10 +446,12 @@ const populateMap = async(mapData) => {
}); });
timeLayer.addTo(map); timeLayer.addTo(map);
// FIX: comment out to avoid DB calls
// style currentTiles // style currentTiles
let option = $("#indicatorSelect").val(); // option selected from dropdrown /*let option = $("#indicatorSelect").val(); // option selected from dropdrown
styleTiles(option, minIndicators, maxIndicators) styleTiles(option, minIndicators, maxIndicators)
.then(legend.addTo(map)); // add legend control -> it updates .then(legend.addTo(map)); // add legend control -> it updates
*/
let baseLayers = { let baseLayers = {
"Carto Dark": cartoDarkLayer, "Carto Dark": cartoDarkLayer,
...@@ -444,7 +459,7 @@ const populateMap = async(mapData) => { ...@@ -444,7 +459,7 @@ const populateMap = async(mapData) => {
"OpenStreetMap": osmLayer "OpenStreetMap": osmLayer
}; };
var overlays = { 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); layerControl = L.control.layers(baseLayers, overlays).addTo(map);
...@@ -455,8 +470,9 @@ const populateMap = async(mapData) => { ...@@ -455,8 +470,9 @@ const populateMap = async(mapData) => {
const updateMap = (mapData) => { const updateMap = (mapData) => {
//console.log(userFiles); //console.log(userFiles);
// FIX: comment out to avoid DB calls
// clear tiles // clear tiles
currentTiles = {}; /* currentTiles = {};
//retrieve or create tiles for current dates //retrieve or create tiles for current dates
userFiles.forEach(monthYear => { userFiles.forEach(monthYear => {
if (Object.keys(allTiles).includes(monthYear)) { if (Object.keys(allTiles).includes(monthYear)) {
...@@ -504,6 +520,7 @@ const updateMap = (mapData) => { ...@@ -504,6 +520,7 @@ const updateMap = (mapData) => {
}); });
// Update charts // Update charts
updateCharts(); updateCharts();
*/
} }
const updateCharts = async() => { const updateCharts = async() => {
......
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