caching data from server to increase speed
This commit is contained in:
parent
ce64a9140e
commit
277c058450
1 changed files with 63 additions and 57 deletions
|
@ -14,6 +14,7 @@ export class MoreStuffComponent implements OnInit {
|
||||||
@Input() public categories: any;
|
@Input() public categories: any;
|
||||||
bubbleChartBegin: any;
|
bubbleChartBegin: any;
|
||||||
bubbleChartEnd: any;
|
bubbleChartEnd: any;
|
||||||
|
cached_graph_data: any;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private api: ApiService,
|
private api: ApiService,
|
||||||
|
@ -52,21 +53,15 @@ export class MoreStuffComponent implements OnInit {
|
||||||
* Supplier Bubble Chart Setup
|
* Supplier Bubble Chart Setup
|
||||||
*/
|
*/
|
||||||
|
|
||||||
private loadSupplierBubble(useRange: boolean, start_range : string, end_range : string) {
|
private formatGraphData(passed_graph_data: any, useRange : boolean, start_range: string, end_range: string) : any[] {
|
||||||
console.log("Fetching data for bubble chart... this will take a while. custom range = " + useRange);
|
|
||||||
|
|
||||||
this.api.loadMiscUrl('organisation/external/supplier_count').subscribe(
|
|
||||||
result => {
|
|
||||||
let graph_data = [];
|
let graph_data = [];
|
||||||
|
|
||||||
if (useRange == true) {
|
if (useRange == true) {
|
||||||
console.log("using range " + start_range + " : " + end_range);
|
console.log("using range " + start_range + " : " + end_range);
|
||||||
result.data.map(item=> {
|
passed_graph_data.data.map(item=> {
|
||||||
let is_item_in_range = (new Date(item.date) >= new Date(start_range) && new Date(item.date) <= new Date(end_range));
|
let is_item_in_range = (new Date(item.date) >= new Date(start_range) && new Date(item.date) <= new Date(end_range));
|
||||||
// there are a lot of `new Date(blah)` but that is what works for some reason.
|
// there are a lot of `new Date(blah)` but that is what works for some reason.
|
||||||
|
|
||||||
// IT WORKS!!!!!!!!!
|
|
||||||
|
|
||||||
console.log("item.date : " + new Date(item.date));
|
console.log("item.date : " + new Date(item.date));
|
||||||
console.log("start_range input box: " + start_range);
|
console.log("start_range input box: " + start_range);
|
||||||
console.log("start_range : " + new Date(start_range));
|
console.log("start_range : " + new Date(start_range));
|
||||||
|
@ -89,9 +84,9 @@ export class MoreStuffComponent implements OnInit {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
this.supplierBubbleChartData[0].data = graph_data;
|
return graph_data;
|
||||||
} else {
|
} else {
|
||||||
result.data.map(item => {
|
passed_graph_data.data.map(item => {
|
||||||
graph_data.push({
|
graph_data.push({
|
||||||
t: item.date,
|
t: item.date,
|
||||||
r: item.value > 1000000 ? (item.value / 1000000) + 10 : (item.value / 100000) + 5,
|
r: item.value > 1000000 ? (item.value / 1000000) + 10 : (item.value / 100000) + 5,
|
||||||
|
@ -102,15 +97,29 @@ export class MoreStuffComponent implements OnInit {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
this.supplierBubbleChartData[0].data = graph_data;
|
return graph_data;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.supplierBubbleChartData[0].data = graph_data;
|
private loadSupplierBubble(useRange: boolean, start_range : string, end_range : string) {
|
||||||
console.log("Graph fetched with " + graph_data.length + " items.");
|
console.log("Fetching data for bubble chart... this will take a while. custom range = " + useRange);
|
||||||
|
|
||||||
|
if (this.cached_graph_data) {
|
||||||
|
this.supplierBubbleChartData[0].data = this.formatGraphData(this.cached_graph_data, useRange, start_range, end_range);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.api.loadMiscUrl('organisation/external/supplier_count').subscribe(
|
||||||
|
result => {
|
||||||
|
this.cached_graph_data = result;
|
||||||
|
|
||||||
|
this.supplierBubbleChartData[0].data = this.formatGraphData(this.cached_graph_data, useRange, start_range, end_range);
|
||||||
|
console.log("Graph fetched with " + this.cached_graph_data.length + " items.");
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
public supplierBubbleChartType: ChartType = 'bubble';
|
public supplierBubbleChartType: ChartType = 'bubble';
|
||||||
public supplierBubbleChartData: any[] = [
|
public supplierBubbleChartData: any[] = [
|
||||||
{
|
{
|
||||||
|
@ -165,7 +174,7 @@ export class MoreStuffComponent implements OnInit {
|
||||||
let value_data = [];
|
let value_data = [];
|
||||||
let count_data = [];
|
let count_data = [];
|
||||||
|
|
||||||
console.log("Graph being fetched.");
|
console.log("Graph being fetched from server.");
|
||||||
result.data.map(item => {
|
result.data.map(item => {
|
||||||
value_data.push({
|
value_data.push({
|
||||||
t: item.date,
|
t: item.date,
|
||||||
|
@ -186,13 +195,10 @@ export class MoreStuffComponent implements OnInit {
|
||||||
|
|
||||||
bubbleChartUpdate() {
|
bubbleChartUpdate() {
|
||||||
console.log("start_range input box: " + this.bubbleChartBegin);
|
console.log("start_range input box: " + this.bubbleChartBegin);
|
||||||
console.log("start_range : " + new Date(this.bubbleChartBegin));
|
|
||||||
console.log("end_range input box: " + this.bubbleChartEnd);
|
console.log("end_range input box: " + this.bubbleChartEnd);
|
||||||
console.log("end_range : " + new Date(this.bubbleChartEnd));
|
|
||||||
|
|
||||||
// this is called when daterange is changed
|
// this is called when daterange is changed
|
||||||
this.loadSupplierBubble(true, (this.bubbleChartBegin), (this.bubbleChartEnd));
|
this.loadSupplierBubble(true, (this.bubbleChartBegin), (this.bubbleChartEnd));
|
||||||
console.log("Bubble chart updating...");
|
|
||||||
/*
|
/*
|
||||||
bubbleChartBegin: any;
|
bubbleChartBegin: any;
|
||||||
bubbleChartEnd: any;
|
bubbleChartEnd: any;
|
||||||
|
|
Reference in a new issue