Skip to content
Snippets Groups Projects
plotter.component.ts 3.87 KiB
Newer Older
import { Component } from '@angular/core';
import { GHCIService } from '../../shared/services/ghci.service'; 
import  functionPlot from 'function-plot';
 
@Component({
    moduleId: module.id,
    selector: 'plotter-component',
    templateUrl: './plotter.component.html',
    host: {
        
    }
})
export class PlotterComponent {
    public constructor(private ghciService: GHCIService) {
        ghciService.messages.subscribe(
            canvas=>{
                if (canvas.tipo == 'graph'){
                    var jsonCanvas = JSON.parse(canvas.resultado);
                    let fun = eval(this.generarFuncion(jsonCanvas));

                    functionPlot({
                        target: '#plotter-container',
                        width: 620,
                        height: 450,
                        data: [{
                            sampler: 'builtIn',
                            fn: function(scope) {
                              return fun(scope.x)
                            },
                            graphType: 'polyline'
                        }]
                      })
                }
        },
        error=>{
            
        })
    }


    
    generarFuncion = function(graph) {
            var funcionString = '';
            var grafica;
            for (var fun of graph.funs) {
                funcionString = 'var ' + fun.fun + ' = function(' + fun.args.join() + '){\n return ' + this.generarExpresion(fun.bdy) + '}\n' + funcionString;

                if (fun.fun == graph.graph) {
                    funcionString += 'return ' + fun.fun + '(' + fun.args.join() + ');\n'
                    grafica = fun;
                }
            }
            funcionString = '(' + grafica.args.join() + ',delta,hayPunto)=>{\n' + funcionString + '}';
            
            console.log('funcion string', funcionString);
            return funcionString;
        }

    generarExpresion = function(exp) {
        var expresion = '';
        if (exp.kind == 'cnd') {
        expresion = ' (' + this.generarExpresion(exp.cond) + '?' + this.generarExpresion(exp.exp1) + ':' + this.generarExpresion(exp.exp2) + ') ';
        } else if (exp.kind == 'bop') {
        if (exp.op == '==') {
            expresion = ' Math.abs((' + this.generarExpresion(exp.exp1) + ') - (' + this.generarExpresion(exp.exp2) + ')) < delta && hayPunto() ';
        } else if (exp.op == '/=') {
            expresion = ' Math.abs((' + this.generarExpresion(exp.exp1) + ') - (' + this.generarExpresion(exp.exp2) + ')) > delta ||  Math.abs((' + this.generarExpresion(exp.exp1) + ') - (' + this.generarExpresion(exp.exp2) + ')) < delta && !hayPunto()  ';
        } else if (exp.op == '^') {
            expresion = ' Math.pow(' + this.generarExpresion(exp.exp1) + ',' + this.generarExpresion(exp.exp2) + ') ';
        } else {
            expresion = ' (' + this.generarExpresion(exp.exp1) + ')' + exp.op + '(' + this.generarExpresion(exp.exp2) + ') ';
        }
        } else if (exp.kind == 'uop') {
        expresion = ' ' + exp.op + ' ' + this.generarExpresion(exp.exp) + ' ';
        } else if (exp.kind == 'app') {
        if (exp.fun == 'cos') {
            exp.fun = 'Math.cos'
        } else if (exp.fun == 'sen') {
            exp.fun = 'Math.sin'
        } else if (exp.fun == 'red') {
            exp.fun = 'Math.round'
        }
        expresion = ' ' + exp.fun + '(' + exp.args.map(e => this.generarExpresion(e)).join() + ') ';
        } else if (exp.kind == 'tup') {
        expresion = ' (' + exp.exps.map(e => this.generarExpresion(e)).join() + ') ';
        } else if (exp.kind == 'lit') {
        expresion = ' ' + exp.val + ' ';
        } else if (exp.kind == 'var') {
        expresion = ' ' + exp.var+' ';
        } else {
        expresion = ' undefined ';
        }
    
        return expresion;
    }
    
 
  
}