Skip to content

F
fordecyt_2019
Commit d614b02b authored by Tania Gómez's avatar Tania Gómez
Browse files
Options

update urbanization data grouped by yeartrimes

parent 2a468b2b
Hide whitespace changes
Inline Side-by-side
Showing with 155 additions and 98 deletions
public/js/evolucion_urbana_charts.js
View file @ d614b02b
......@@ -11,6 +11,25 @@ let minValue, maxValue;
let mainTextColor = getComputedStyle(document.body).getPropertyValue('--main-text-color');
let cellbgColor = getComputedStyle(document.body).getPropertyValue('--main-bg-color');
//http://localhost:8090/data/query/urbanization_year?columns=yeartrimes,area
// funcion copiada de evolucion_urbana.js
//const areaTable = 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)`}`;
// let areaQuery = `${baseUrl}/query/${table}?columns=${`yeartrimes,area`}`;
/* d3.json(areaQuery).then(minmax => {
// resolve(minmax[0]);
});*/
// });
//}
//select yeartrimes, sum(area) from urbanization_year_diss group by yeartrimes order by yeartrimes;
// amChart
am4core.ready(function() {
......@@ -18,96 +37,127 @@ am4core.ready(function() {
// Add data
chart.data = [{
"date": "2013-01-16",
"market1": 71,
"market2": 75,
"sales1": 5,
"sales2": 8
}, {
"date": "2013-01-17",
"market1": 74,
"market2": 78,
"sales1": 4,
"sales2": 6
}, {
"date": "2013-01-18",
"market1": 78,
"market2": 88,
"sales1": 5,
"sales2": 2
}, {
"date": "2013-01-19",
"market1": 85,
"market2": 89,
"sales1": 8,
"sales2": 9
}, {
"date": "2013-01-20",
"market1": 82,
"market2": 89,
"sales1": 9,
"sales2": 6
}, {
"date": "2013-01-21",
"market1": 83,
"market2": 85,
"sales1": 3,
"sales2": 5
}, {
"date": "2013-01-22",
"market1": 88,
"market2": 92,
"sales1": 5,
"sales2": 7
}, {
"date": "2013-01-23",
"market1": 85,
"market2": 90,
"sales1": 7,
"sales2": 6
}, {
"date": "2013-01-24",
"market1": 85,
"market2": 91,
"sales1": 9,
"sales2": 5
}, {
"date": "2013-01-25",
"market1": 80,
"market2": 84,
"sales1": 5,
"sales2": 8
}, {
"date": "2013-01-26",
"market1": 87,
"market2": 92,
"sales1": 4,
"sales2": 8
}, {
"date": "2013-01-27",
"market1": 84,
"market2": 87,
"sales1": 3,
"sales2": 4
}, {
"date": "2013-01-28",
"market1": 83,
"market2": 88,
"sales1": 5,
"sales2": 7
}, {
"date": "2013-01-29",
"market1": 84,
"market2": 87,
"sales1": 5,
"sales2": 8
}, {
"date": "2014-06-30",
"area": 15412732.6,
"cum_area": 15412732.6,
"delta": 0
}, {
"date": "2014-09-30",
"area": 4732329.07,
"cum_area": 20145061.67,
"delta": 31
}, {
"date": "2014-12-31",
"area": 7162111.485,
"cum_area": 27307173.15,
"delta": 36
}, {
"date": "2015-03-31",
"area": 6092156.55,
"cum_area": 33399329.7,
"delta": 22
}, {
"date": "2015-06-30",
"area": 15920921.92,
"cum_area": 49320251.62,
"delta": 48
}, {
"date": "2015-09-30",
"area": 9240033.81,
"cum_area": 58560285.43,
"delta": 19
}, {
"date": "2015-12-31",
"area": 8401142.98,
"cum_area": 66961428.41,
"delta": 14
}, {
"date": "2016-03-31",
"area": 8074638.35,//3,
"cum_area": 75036066.76,
"delta": 12
}, {
"date": "2016-06-30",
"area": 122507.39,//55,
"cum_area": 75158574.16,
"delta": 0
}, {
"date": "2016-09-30",
"area": 25938802.55,
"cum_area": 101097376.7,
"delta": 35
}, {
"date": "2016-12-31",
"area": 8390046.92,
"cum_area": 109487423.6,
"delta": 8
}, {
"date": "2017-03-31",
"area": 7589780.379,
"cum_area": 117077204,
"delta": 7
}, {
"date": "2017-06-30",
"area": 47964.71,//734,
"cum_area": 117125168.7,
"delta": 0
}, {
"date": "2017-09-30",
"area": 28417421.7,
"cum_area": 145542590.4,
"delta": 24
}, {
"date": "2017-12-31",
"area": 8770996.298,
"cum_area": 154313586.7,
"delta": 6
}, /*{
"date": "2018-03-31",
"area": 0,
"cum_area": 0,
"delta": 0
},*/ {
"date": "2018-06-30",
"area": 10867609.97,
"cum_area": 165181196.7,
"delta": 7
}, {
"date": "2018-09-30",
"area": 49281520.15,
"cum_area": 214462716.8,
"delta": 30
}, {
"date": "2018-12-31",
"area": 33658169.408,
"cum_area": 248120886.2,
"delta": 16
}, {
"date": "2019-03-31",
"area": 59364663.86,
"cum_area": 307485550.1,
"delta": 24
}, {
"date": "2019-06-30",
"area": 4934.68,//7186,
"cum_area": 307490484.8,
"delta": 0
}, {
"date": "2019-09-30",
"area": 109814786.2,
"cum_area": 417305271,
"delta": 36
}, {
"date": "2019-12-31",
"area": 6689.99,//5409,
"cum_area": 417311961,
"delta": 0
}/*,{
"date": "2013-01-30",
"market1": 81,
"market2": 85,
"sales1": 4,
"sales2": 7
}];
}*/];
// Create axes
var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
......@@ -115,50 +165,57 @@ am4core.ready(function() {
//dateAxis.renderer.minGridDistance = 30;
var valueAxis1 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis1.title.text = "Sales";
valueAxis1.title.text = "Area Ocupada";//"Sales";
var valueAxis2 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis2.title.text = "Market Days";
valueAxis2.title.text = "Incremento Porcentual"//"Market Days";
valueAxis2.renderer.opposite = true;
valueAxis2.renderer.grid.template.disabled = true;
// Create series
var series1 = chart.series.push(new am4charts.ColumnSeries());
series1.dataFields.valueY = "sales1";
series1.dataFields.valueY = "area";//"sales1";
series1.dataFields.dateX = "date";
series1.yAxis = valueAxis1;
series1.name = "Target Sales";
series1.tooltipText = "{name}\n[bold font-size: 20]${valueY}M[/]";
series1.name = "Area ocupada trimestral";//"Target Sales";
series1.tooltipText = "{name}\n[bold font-size: 20]{valueY}";//M[/]";
series1.fill = chart.colors.getIndex(0);
series1.strokeWidth = 0;
series1.clustered = false;
series1.columns.template.width = am4core.percent(40);
var series2 = chart.series.push(new am4charts.ColumnSeries());
series2.dataFields.valueY = "sales2";
series2.dataFields.valueY = "cum_area";//"sales2";
series2.dataFields.dateX = "date";
series2.yAxis = valueAxis1;
series2.name = "Actual Sales";
series2.tooltipText = "{name}\n[bold font-size: 20]${valueY}M[/]";
series2.name = "Area acumulada total";//"Actual Sales";
series2.tooltipText = "{name}\n[bold font-size: 20]{valueY}";//M[/]";
series2.fill = chart.colors.getIndex(0).lighten(0.5);
series2.strokeWidth = 0;
series2.clustered = false;
series2.toBack();
var series3 = chart.series.push(new am4charts.LineSeries());
series3.dataFields.valueY = "market1";
series3.dataFields.valueY = "delta";//"market1";
series3.dataFields.dateX = "date";
series3.name = "Market Days";
series3.name = "Incremento respecto al area acumulada";//"Market Days";
series3.strokeWidth = 2;
series3.tensionX = 0.7;
series3.stroke = am4core.color("#A91B0D");
series3.strokeDasharray = "3,3";
series3.yAxis = valueAxis2;
series3.tooltipText = "{name}\n[bold font-size: 20]{valueY}[/]";
series3.tooltipText = "{name}\n[bold font-size: 20]{valueY}\%[/]";
series3.tooltip.getFillFromObject = false;
series3.tooltip.background.fill = am4core.color("#A91B0D");
var bullet3 = series3.bullets.push(new am4charts.CircleBullet());
bullet3.circle.radius = 3;
bullet3.circle.strokeWidth = 2;
bullet3.circle.fill = am4core.color("#fff");
bullet3.circle.stroke = am4core.color("#A91B0D");
/*
var series4 = chart.series.push(new am4charts.LineSeries());
series4.dataFields.valueY = "market2";
series4.dataFields.dateX = "date";
......@@ -174,7 +231,7 @@ am4core.ready(function() {
bullet4.circle.radius = 3;
bullet4.circle.strokeWidth = 2;
bullet4.circle.fill = am4core.color("#fff");
*/
// Add cursor
chart.cursor = new am4charts.XYCursor();
......
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