From ff4b856669894b5ee344ca0e5f0522e45b32dcba Mon Sep 17 00:00:00 2001
From: Diego Rey <diego.despaux@izundo.com>
Date: Tue, 18 Sep 2018 21:24:31 -0300
Subject: [PATCH] Added zoom and multigraf controls on settings popover
---
Frontend Angular 4/package-lock.json | 4 +--
Frontend Angular 4/package.json | 2 +-
.../plotter/graph2D/graph2D.component.html | 28 +++++++++++++++++--
.../plotter/graph2D/graph2D.component.ts | 12 ++++----
4 files changed, 35 insertions(+), 11 deletions(-)
diff --git a/Frontend Angular 4/package-lock.json b/Frontend Angular 4/package-lock.json
index df45be9d..e451e264 100644
--- a/Frontend Angular 4/package-lock.json
+++ b/Frontend Angular 4/package-lock.json
@@ -4139,8 +4139,8 @@
"dev": true
},
"function-plot": {
- "version": "git://github.com/diego-rey/function-plot.git#925138ee94815e91f48c82b1dca9d55901aeb20e",
- "from": "git://github.com/diego-rey/function-plot.git#feature/mutigraf",
+ "version": "git://github.com/diego-rey/function-plot.git#81713c85f1fb90ff0f41a3dade1bcd831e80b6fa",
+ "from": "git://github.com/diego-rey/function-plot.git#feature/integration-multigraf-shape",
"requires": {
"array-range": "^1.0.1",
"built-in-math-eval": "^0.3.0",
diff --git a/Frontend Angular 4/package.json b/Frontend Angular 4/package.json
index d660e698..5d10bb8b 100755
--- a/Frontend Angular 4/package.json
+++ b/Frontend Angular 4/package.json
@@ -24,7 +24,7 @@
"core-js": "^2.4.1",
"d3": "^4.12.2",
"font-awesome": "^4.7.0",
- "function-plot": "git://github.com/diego-rey/function-plot.git#feature/mutigraf",
+ "function-plot": "git://github.com/diego-rey/function-plot.git#feature/integration-multigraf-shape",
"graph3D": "git://github.com/ifagian/graph3D#master",
"ionicons": "^3.0.0",
"jq-console": "^2.13.2",
diff --git a/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.html b/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.html
index 939fcb1e..c6085c07 100755
--- a/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.html
+++ b/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.html
@@ -86,6 +86,31 @@
Tip
</label>
</div>
+ <hr>
+ <div class="setting-section">
+ <label>
+ <input
+ type="checkbox"
+ [checked]=animation.boton
+ (click)="multiGraf(value)">
+ Multi gráfica
+ </label>
+ <div style="display: flex;">
+ <span style="margin-right: 8px; align-self: center;">
+ Zoom
+ </span>
+ <input
+ type="number"
+ class="form-control form-control-sm"
+ [(ngModel)]="animation.zoo"
+ [max]="1000000"
+ [min]="8"
+ (change)="setZoom()"
+ style="width: 70px;"
+ />
+ </div>
+ </div>
+ <hr>
<div class="animation-controls setting-section"
[class.disabled]="animation.data.length === 0">
<label>Velocidad de animación:</label>
@@ -114,8 +139,7 @@
</ng-template>
<!-- Animation -->
- <!-- <div class="animation" *ngIf="animation.data.length>0"> -->
- <div class="animation">
+ <div class="animation" *ngIf="animation.data.length>0">
<button class="btn btn-sm btn-secondary btn-play"
data-placement="bottom"
*ngIf="!animation.playing"
diff --git a/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.ts b/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.ts
index 457088f8..bedc95a0 100755
--- a/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.ts
+++ b/Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.ts
@@ -162,6 +162,7 @@ export class Graph2DComponent {
});
}
let bounding = this.getBounding();
+ console.log(bounding);
this.instance = functionPlot({
target: '#graph2D-container',
width: bounding.width,
@@ -265,12 +266,11 @@ export class Graph2DComponent {
onResize(event){
let instance = this.instance;
let bounding = this.getBounding();
- //if (bounding.width > 0) {
- console.log('yes');
+ if (bounding.width > 0) {
instance.options.width = bounding.width;
instance.options.height = bounding.height;
instance.build();
- //}
+ }
}
onClickMe(event) {
@@ -368,7 +368,7 @@ export class Graph2DComponent {
* @desc Show and Hide Grid
*/
public toggleGrid = function () {
- //this.instance.toggleGrid();
+ this.instance.toggleGrid();
}
/**
@@ -376,7 +376,7 @@ export class Graph2DComponent {
* @desc Show and Hide Axis
*/
public toggleAxis = function () {
- //this.instance.toggleAxis();
+ this.instance.toggleAxis();
}
/**
@@ -384,7 +384,7 @@ export class Graph2DComponent {
* @desc Show and Hide Tip
*/
public toggleTip = function () {
- //this.instance.toggleTip();
+ this.instance.toggleTip();
}
/**
--
GitLab