Commit 0ea1bf63 authored by jose.ignacio.fagian's avatar jose.ignacio.fagian
Browse files

Parametrizaciones de opciones para el visor 3D, regex de parseo line3D

parent 52188d72
...@@ -175,8 +175,12 @@ ...@@ -175,8 +175,12 @@
<input <input
type="number" type="number"
style="width: 55px;"
class="form-control form-control-sm" class="form-control form-control-sm"
[(ngModel)]="graphProps.quality"
[max]="99"
[min]="2"
(change)="onChangeQuality()"
style="width: 55px;"
/> />
</div> </div>
</div> </div>
......
import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core'; import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core';
import * as graph3DLib from 'graph3d'; import * as graph3DLib from 'graph3d';
import { GHCIService } from '../../../shared/services/ghci.service'; import { GHCIService } from '../../../shared/services/ghci.service';
import { formatJSON, AnimationProps, Zoom3DType, GraphProps, Default_GraphProps } from './graph3D.helper'; import { formatJSON, AnimationProps, Zoom3DType, GraphProps, Default_GraphProps, debounce } from './graph3D.helper';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators'
@Component({ @Component({
selector: 'graph3d-component', selector: 'graph3d-component',
...@@ -104,12 +105,23 @@ export class Graph3DComponent implements OnInit { ...@@ -104,12 +105,23 @@ export class Graph3DComponent implements OnInit {
graph3DLib.showAxes(this.graphProps.showAxes); graph3DLib.showAxes(this.graphProps.showAxes);
} }
handleAxesRangeDebounced = debounce(function () {
setTimeout(() =>
graph3DLib.changeAxesSize(this.graphProps.range)
);
}, 500);
public onChangeAxesSize = (v, event) => { public onChangeAxesSize = (v, event) => {
let value = this.graphProps.range[v]; let value = this.graphProps.range[v];
const min = parseInt(event.target.min); const min = parseInt(event.target.min);
const max = parseInt(event.target.max); const max = parseInt(event.target.max);
if (value == null) {
value = v.search('Min') ? min : max;
this.graphProps.range[v] = value;
}
if (value < min) { if (value < min) {
this.graphProps.range[v] = min; this.graphProps.range[v] = min;
} }
...@@ -117,8 +129,21 @@ export class Graph3DComponent implements OnInit { ...@@ -117,8 +129,21 @@ export class Graph3DComponent implements OnInit {
if (value > max) { if (value > max) {
this.graphProps.range[v] = max; this.graphProps.range[v] = max;
} }
this.handleAxesRangeDebounced();
//graph3DLib.changeAxesSize(this.graphProps.range)
}
public onChangeQuality = () => {
const value = this.graphProps.quality;
graph3DLib.changeAxesSize(this.graphProps.range) if (value == null || value <= 1) {
this.graphProps.quality = 30;
}
else {
this.graphProps.quality = value;
}
graph3DLib.changeOptions({quality: value});
} }
public zoomIn = () => { public zoomIn = () => {
......
export function formatJSON(jsonString: string) : string { export function formatJSON(jsonString: string) : string {
const regexRot = /\"rot\"\:\((\d*.\d*),(\d*.\d*),(\d*.\d*)\)/g; const regexRot = /\"rot\"\:\((\d*.\d*),(\d*.\d*),(\d*.\d*)\)/g;
const regexPts = /\"pts\"\:\[\((\-?\d*.\d*),(\-?\d*.\d*),(\-?\d*.\d*)\),\((\-?\d*.\d*),(\-?\d*.\d*),(\-?\d*.\d*)\)\]/g;
return jsonString.replace( return jsonString
regexRot, (match, x, y, z) => { .replace(
return `"rot": { "x": ${x}, "y": ${y}, "z": ${z} }` regexRot, (match, x, y, z) => {
} return `"rot": { "x": ${x}, "y": ${y}, "z": ${z} }`
) }
)
.replace(
regexPts, (match, x1, y1, z1, x2, y2, z2) => {
return `"pts": [{ "x": ${x1}, "y": ${y1}, "z": ${z1} },{ "x": ${x2}, "y": ${y2}, "z": ${z2} }]`
}
)
} }
...@@ -26,6 +33,7 @@ export enum Zoom3DType { ...@@ -26,6 +33,7 @@ export enum Zoom3DType {
export interface GraphProps { export interface GraphProps {
zoomType?: Zoom3DType, zoomType?: Zoom3DType,
showAxes?: boolean, showAxes?: boolean,
quality?: number,
range: { range: {
xMin?: number, xMin?: number,
xMax?: number, xMax?: number,
...@@ -39,6 +47,7 @@ export interface GraphProps { ...@@ -39,6 +47,7 @@ export interface GraphProps {
export const Default_GraphProps : GraphProps = { export const Default_GraphProps : GraphProps = {
zoomType: Zoom3DType.Normal, zoomType: Zoom3DType.Normal,
showAxes: true, showAxes: true,
quality: 30,
range: { range: {
xMin: -10, xMin: -10,
xMax: 10, xMax: 10,
...@@ -49,3 +58,14 @@ export const Default_GraphProps : GraphProps = { ...@@ -49,3 +58,14 @@ export const Default_GraphProps : GraphProps = {
} }
} }
export function debounce(fn, delay) {
var timer = null;
return function () {
var context = this, args = arguments;
clearTimeout(timer);
timer = setTimeout(function () {
fn.apply(context, args);
}, delay);
};
}
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