data extractor help

[serkandemirel0420]

function dfs(grid, r, c, visit) {
  const ROWS = grid.length;
  const COLS = grid[0].length;
  if (r < 0 || r >= ROWS || c < 0 || c >= COLS || visit.has(r + ',' + c) || grid[r][c] === 1) {
    return 0;
  }
  if (r === ROWS - 1 && c === COLS - 1) {
    return 1;
  }
  visit.add(r + ',' + c);
  let count = 0;
 
  count += dfs(grid, r + 1, c, visit);
  count += dfs(grid, r - 1, c, visit);
  count += dfs(grid, r, c + 1, visit);
  count += dfs(grid, r, c - 1, visit);
 
  visit.delete(r + ',' + c);
  return count;
}

const grid = [
  [0, 0, 0, 0],
  [0, 1, 0, 1],
  [0, 0, 0, 0]
];


console.log(dfs(grid, 0, 0, new Set()));

for such a function, can someone point me a direction how i can use the data extractor? I wrote some manuel code(used stack library and such) but feel like i am doing an unnecessary work..

import { get } from "stack-trace";

let graph2 = {
  kind: { graph: true },
  nodes: [{ id: "LOG", label: "Label" }],
  edges: [],
};

class Logging {
  constructor(functionName) {
    this.functionName = functionName;
    this.node = { id: "", label: "1" };
    this.edge = { from: "", to: "" };
    this.stack = [];
    this.graph = {
      kind: { graph: true },
      nodes: [],
      edges: [],
    };
    this.stackCount = 0;
    this.counter = 0;
  }

  trace(param) {

    console.log("hey")
    let trace = get();
    let currentCount = trace.filter(
      (item) => item.getFunctionName() === this.functionName
    ).length;
    console.log(this.stack.length, " -- ", currentCount)

    if (this.stack.length < currentCount) {

      console.log("girdi")

      let newNode = { ...this.node };
      newNode["id"] = (++this.counter).toString();
      newNode["label"] = JSON.stringify(param);
      newNode["oldLabel"] = JSON.stringify(param);

      // Initialize the logArr property of the new node
      newNode.logArr = [];

      this.stack.push(newNode);
      this.updateGraph();
    } else if (this.stack.length > currentCount) {
      //pop
      this.stack.pop();
      this.color();
    }
    return this.graph
  }

  color() {
    let currentId = this.stack.length > 0 ? this.stack.slice(-1)[0].id : null;
    this.graph.nodes = this.graph.nodes.map((item) => {
      if (item.id === currentId) {
        return { ...item, color: "yellow" };
      } else {
        return { ...item, color: "lightblue" };
      }
    });
  }

  updateGraph() {
    // let newNode = {...node};
    let newEdge = { ...this.edge };

    this.graph.nodes.push(this.stack.slice(-1)[0]);

    let current = this.stack.slice(-1)[0];
    let parent = this.stack.slice(-2)[0];
    newEdge.from = parent.id;
    newEdge.to = current.id;

    if (this.stack.length > 1) {
      this.graph.edges.push(newEdge);
    }
    this.color();
  }

   


}


function wrapper(fn, additionalFn) {
  return function (...args) {
    additionalFn();
    return fn(...args);
  }
}


 

function canSum(targetSum, arr) {
  logging.trace(targetSum)
  if (targetSum == 0) return true;
  if (targetSum < 0) return false;

  for (let num of arr) {
    const remainder = targetSum - num;
    if (canSum(remainder, arr) == true) {
      return true;
    }
  }

  return false;

};



const logging = new Logging("canSum");
let new_canSum = wrapper(canSum, () => {
  logging.trace();
  console.log('Trace started!')
});


new_canSum(5, [2, 3]);


// const logging = new Logging("canSum");
// canSum(7, [3, 2])

thanks

[hediet]

Unfortunately, your code does not seem to work. What do you want to visualize?

[serkandemirel0420]

Sorry, I updated the code for another function. I would like to visualize the call stack as graph.