Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
matefun
Frontend
Commits
e842aa8d
Commit
e842aa8d
authored
Sep 18, 2018
by
Leonel Rosano
Browse files
Modificación del zoom y solución de errores
parent
5b9a7f5e
Changes
6
Expand all
Hide whitespace changes
Inline
Side-by-side
Frontend Angular 4/npm-debug.log
0 → 100644
View file @
e842aa8d
This diff is collapsed.
Click to expand it.
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
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment