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

Merge line+area chart into one call

parent dc2b749b
...@@ -323,9 +323,10 @@ const populateMap = async(mapData) => { ...@@ -323,9 +323,10 @@ const populateMap = async(mapData) => {
makeRadialChart(chartData, monthArray, yearList); makeRadialChart(chartData, monthArray, yearList);
}); });
// LINE CHART // LINE + STACKED AREA CHARTS
// get am chart - may need this to update chart on date change // get am chart - may need this to update chart on date change
//let linesChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "linesChart"); //let linesChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "linesChart");
//let stackedAreaChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "stackedAreaChart");
// async queries for each date that has been loaded // async queries for each date that has been loaded
const queries_ls = userFiles.map(async(mes, i) => { const queries_ls = userFiles.map(async(mes, i) => {
...@@ -359,44 +360,6 @@ const populateMap = async(mapData) => { ...@@ -359,44 +360,6 @@ const populateMap = async(mapData) => {
chartData.sort((a, b) => (a.date > b.date) ? 1 : -1); chartData.sort((a, b) => (a.date > b.date) ? 1 : -1);
makeLineChart(chartData); makeLineChart(chartData);
});
// STACKED AREA CHART
// get am chart - may need this to update chart on date change
//let stackedAreaChart = am4core.registry.baseSprites.find(c => c.htmlContainer.id === "stackedAreaChart");
// async queries for each date that has been loaded
// TODO: this is the exact same call as in LINE CHART => merge into one
const queries_sa = userFiles.map(async(mes, i) => {
let query_sa = `${baseUrl}/query/${mes}?columns=sum(areacpo)/10000 area, descrip&group=descrip`;
const queryData = await d3.json(query_sa);
for (const wbody in queryData) {
queryData[wbody].date = new Date(userDates[i]);
}
//data_sa.push(queryData);
return new Promise(resolve => {
resolve(queryData);
});
});
// wait for all queries to complete and then set chart data
Promise.all(queries_sa).then( data => {
// TODO: maybe make this a function so it can be used to update chart when changing dates
let merged = [].concat.apply([], data);
let aguaPermanente = merged.filter(d => d.descrip == "Agua permanente" );
let aguaTemporal = merged.filter(d => d.descrip == "Áreas temporalmente inundadas" );
let aguaVegetacion = merged.filter(d => d.descrip == "Suelos húmedos-vegetación acuática" );
let chartData = [];
aguaPermanente.forEach( (wb, i) => {
let element = {
permanente: aguaPermanente[i].area,
temporal: aguaTemporal[i].area,
vegetacion: aguaVegetacion[i].area,
date: aguaPermanente[i].date
}
chartData.push(element);
});
chartData.sort((a, b) => (a.date > b.date) ? 1 : -1);
makeAreaChart(chartData); makeAreaChart(chartData);
}); });
......
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