Skip to content

GitLab

Commit e842aa8d authored by Leonel Rosano's avatar Leonel Rosano
Browse files

Modificación del zoom y solución de errores

parent 5b9a7f5e
Expand all Hide whitespace changes
Inline Side-by-side
Frontend Angular 4/npm-debug.log 0 → 100644
View file @ e842aa8d
This diff is collapsed.
Frontend Angular 4/package-lock.json
View file @ e842aa8d
......@@ -4139,8 +4139,8 @@
"dev": true
},
"function-plot": {
"version": "git://github.com/diego-rey/function-plot.git#d60f8903c392702a32ad42097e7b6575af05cb6a",
"from": "git://github.com/diego-rey/function-plot.git#feature/integration-domain-shape",
"version": "git://github.com/diego-rey/function-plot.git#925138ee94815e91f48c82b1dca9d55901aeb20e",
"from": "git://github.com/diego-rey/function-plot.git#feature/mutigraf",
"requires": {
"array-range": "^1.0.1",
"built-in-math-eval": "^0.3.0",
......
Frontend Angular 4/package.json
View file @ e842aa8d
......@@ -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/integration-domain-shape",
"function-plot": "git://github.com/diego-rey/function-plot.git#feature/mutigraf",
"graph3D": "git://github.com/ifagian/graph3D#master",
"ionicons": "^3.0.0",
"jq-console": "^2.13.2",
......
Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.html
View file @ e842aa8d
......@@ -4,8 +4,8 @@
<button ngbPopover="Zoom -" triggers="mouseenter:mouseleave" data-placement="bottom" class="btn btn-sm btn-secondary" style="float:right; margin-right: 132px; margin-top: -55px" (click)=zoomOut() ><i class="fa fa-minus"></i></button>
<button ngbPopover="Centrar" triggers="mouseenter:mouseleave" data-placement="bottom" class="btn btn-sm btn-secondary" style=" float:right; margin-right: 99px; margin-top: -55px" (click)="recenterPlot()" ><i class="fa fa-arrows"></i></button>
<button ngbPopover="Borrar" triggers="mouseenter:mouseleave" data-placement="bottom" class="btn btn-sm btn-secondary" style=" float:right; margin-right: 66px; margin-top: -55px" (click)="cleanPlot()" ><i class="fa fa-trash"></i></button>
<button ngbPopover="Descargar PNG" triggers="mouseenter:mouseleave" data-placement="bottom" class="btn btn-sm btn-secondary" style="float:right; margin-right: 33px; margin-top: -55px" (click)=exportPlot() ><i class="fa fa-download"></i></button>
<button ngbPopover="Descargar PNG" triggers="mouseenter:mouseleave" data-placement="bottom" class="btn btn-sm btn-secondary" style="float:right; margin-right: 33px; margin-top: -55px" (click)=exportPlot() ><i class="fa fa-download"></i></button>
<a id="download-plot" class="download-plot" href="#" download="Plot.svg" style="display: none">Download Canvas</a>
<button class="btn btn-sm btn-secondary" data-placement="bottom" *ngIf="!animation.playing && animation.data.length>0" style=" float:left; margin-top: -5px; margin-right: 5px" (click)="runAnimation()" ><i class="fa fa-play"></i></button>
......@@ -13,7 +13,46 @@
<ngb-progressbar style="float: left; width: 90%" *ngIf="animation.data.length>0" type="info" [value]="((animation.currentFrame+1)/animation.data.length)*100"></ngb-progressbar>
<button
[ngbPopover]=popoverConfig
closePopoverOnOutsideClick
placement="bottom"
style=" float:right; margin-right: 1px; margin-top: -55px"
tiggers="click"
class="btn btn-sm btn-secondary"
popoverTitle="Configuración"
>
<i class="fa fa-gear"></i>
</button>
<ng-template #popoverConfig>
<div style="width: 140px;">
<label class="d-block">
<input type="checkbox" [checked]=animation.boton (click)="multiGraf(value)" >
Multi gráficas:
</label>
<div style="display: flex;">
<span style="margin-right: 8px; align-self: center;">
Zoom:
</span>
<input
type="number"
class="form-control form-control-sm"
[max]="10000"
[min]="2"
[(ngModel)]=animation.zoo
(change)="setZoom()"
style="width: 70px;"
/>
</div>
</div>
</ng-template>
<div id="graph2D-container" style="height: 100%; width: 100%;">
</div>
</div>
</div>
\ No newline at end of file
Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.component.ts
View file @ e842aa8d
......@@ -17,15 +17,31 @@ export class Graph2DComponent {
private instance: null;
private funciones= [];
private id = 0;
private conjunto= [];
animation: Animation = {
data: [],
timer: null,
currentFrame: 0,
speed: 1000,
playing: false,
init: false
init: false,
boton: true,
zoo: 2000
};
//Nuevo
public setZoom = () => {
this.animation.zoo = this.animation.zoo ;
}
public multiGraf = () => {
this.animation.boton = !this.animation.boton;
}
public constructor(private ghciService: GHCIService) {
this.ghciServiceSub = ghciService.messages.subscribe(
canvas => {
......@@ -39,7 +55,7 @@ export class Graph2DComponent {
let fun = eval(this.generarFuncion(jsonCanvas));
var conjs = this.obtenerConjunto(jsonCanvas.funs[0]);
var d = conjs + "}";
var d = conjs + "}"; //Leo
var obj = JSON.parse(d);
//Para las funciones
......@@ -83,19 +99,68 @@ export class Graph2DComponent {
}else{
tipoGraf = 'polyline';
}
this.instance = functionPlot({
target: '#graph2D-container',
width: 620,
height: 450,
conj:obj.conj,
data: [{
if(this.animation.boton && obj.conj.cod != 'Numer' && obj.conj.dom != 'Numer'){
if(this.conjunto.length == 1){
this.id = 1;
this.conjunto.unshift({radio: 2, dom:this.conjunto[0].baseDom, cod:this.conjunto[0].baseCod, baseCod:this.conjunto[0].baseCod, baseDom:this.conjunto[0].baseDom, sets:{fdom:this.conjunto[0].baseDom,fcod:this.conjunto[0].baseCod}});
this.funciones[0].id = this.id;
}
if (this.conjunto.length != 0){
if (obj.conj.baseDom == 'R'){
this.conjunto[0].baseDom = 'R';
this.conjunto[0].dom = 'R';
this.conjunto[0].sets.fdom = 'R';
}
if (obj.conj.baseCod == 'R'){
this.conjunto[0].baseCod = 'R';
this.conjunto[0].cod = 'R';
this.conjunto[0].sets.fcod = 'R';
}
}
this.conjunto.push(obj.conj);
this.funciones.push({
id: this.funciones.length + this.id,
sampler: 'builtIn',
fn: function(scope) {
return fun(scope.x)
},
graphType: tipoGraf,
color: color
}],
});
}else{
this.conjunto = [];
this.conjunto.push(obj.conj);
this.id = 0;
this.funciones = [];
this.funciones.push({
id: this.funciones.length,
sampler: 'builtIn',
fn: function(scope) {
return fun(scope.x)
},
graphType: tipoGraf,
color: color
});
}
this.instance = functionPlot({
target: '#graph2D-container',
width: 620,
height: 450,
tip: { color: 'green' },
xAxis: { label: 'x - axis',
scale: 'linear',
domain: { initial: [-4, 4],
type: 'discrete' },
yAxis: { domain: [-4, 4] }
},
conj:this.conjunto,
data: this.funciones,
zoom:this.animation.zoo,
plugins: [
functionPlot.plugins.zoomBox()
]
......@@ -272,6 +337,9 @@ export class Graph2DComponent {
if (this.animation.playing) {
this.stopAnimation();
} else {
this.funciones = [];
this.conjunto = [];
this.id = 0;
this.instance.removeAllGraphs();
}
}
......@@ -534,10 +602,10 @@ export class Graph2DComponent {
} else if (grf.dom == 'Z') {
dominio += "\"radio\": 2, \"baseDom\": \"Z\", \"dom\": \"Z\"";
setf += "\"fdom\": \"Z\",";
} else if (grf.dom == 'N') {
}/* else if (grf.dom == 'N') {
dominio += "\"radio\":2, \"baseDom\": \"N\", \"dom\": \"N\"";
setf += "\"fdom\": \"N\",";
} else {
}*/ else {
var nom = grf.dom;
if (Array.isArray(grf.sets[0][nom])) {
var arreglo = grf.sets[0][nom];
......
Frontend Angular 4/src/app/layout/plotter/graph2D/graph2D.helper.ts
View file @ e842aa8d
......@@ -4,7 +4,9 @@ export interface Animation {
currentFrame: number,
speed: number,
playing: boolean,
init: boolean
init: boolean,
boton: boolean,
zoo: number,
}
export function toJSON(data: string) : string {
......
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