-
diff --git a/frontend/src/app/components/address-graph/address-graph.component.scss b/frontend/src/app/components/address-graph/address-graph.component.scss
index 62393644b..1b5e0320d 100644
--- a/frontend/src/app/components/address-graph/address-graph.component.scss
+++ b/frontend/src/app/components/address-graph/address-graph.component.scss
@@ -46,7 +46,6 @@
display: flex;
flex: 1;
width: 100%;
- padding-bottom: 10px;
padding-right: 10px;
}
.chart-widget {
diff --git a/frontend/src/app/components/address-graph/address-graph.component.ts b/frontend/src/app/components/address-graph/address-graph.component.ts
index 2ba0cc0a6..e496af84b 100644
--- a/frontend/src/app/components/address-graph/address-graph.component.ts
+++ b/frontend/src/app/components/address-graph/address-graph.component.ts
@@ -50,6 +50,7 @@ export class AddressGraphComponent implements OnChanges, OnDestroy {
hoverData: any[] = [];
showFiat = false;
conversions: any;
+ allowZoom: boolean = false;
subscription: Subscription;
redraw$: BehaviorSubject = new BehaviorSubject(false);
@@ -100,6 +101,7 @@ export class AddressGraphComponent implements OnChanges, OnDestroy {
if (addressSummary) {
this.error = null;
this.conversions = conversions;
+ this.allowZoom = addressSummary.length > 100 && !this.widget;
this.prepareChartOptions(addressSummary);
}
this.isLoading = false;
@@ -169,7 +171,7 @@ export class AddressGraphComponent implements OnChanges, OnDestroy {
animation: false,
grid: {
top: 20,
- bottom: 20,
+ bottom: this.allowZoom ? 65 : 20,
right: this.right,
left: this.left,
},
@@ -337,6 +339,28 @@ export class AddressGraphComponent implements OnChanges, OnDestroy {
step: 'end'
}
],
+ dataZoom: this.allowZoom ? [{
+ type: 'inside',
+ realtime: true,
+ zoomLock: true,
+ maxSpan: 100,
+ minSpan: 5,
+ moveOnMouseMove: false,
+ }, {
+ showDetail: false,
+ show: true,
+ type: 'slider',
+ brushSelect: false,
+ realtime: true,
+ left: this.left,
+ right: this.right,
+ selectedDataBackground: {
+ lineStyle: {
+ color: '#fff',
+ opacity: 0.45,
+ },
+ },
+ }] : undefined
};
}