xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

LeetCode dynamic binary tree generator component All In One

LeetCode dynamic binary tree generator component All In One

LeetCode 二叉树生成器 / Binary Tree Generator

"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2023-01-29
 * @modified
 *
 * @description 104. 二叉树的最大深度
 * @description 104. Maximum Depth of Binary Tree
 * @difficulty Easy
 * @ime_complexity O(n)
 * @space_complexity O(n)
 * @augments
 * @example
 * @link https://leetcode.com/problems/maximum-depth-of-binary-tree/
 * @link https://leetcode.cn/problems/maximum-depth-of-binary-tree/
 * @solutions
 *
 * @best_solutions
 *
 */

export {};

const log = console.log;
class TreeNode {
  val: number;
  left: TreeNode | null;
  right: TreeNode | null;
  constructor(val?: number, left?: TreeNode | null, right?: TreeNode | null) {
    this.val = (val === undefined ? 0 : val);
    this.left = (left === undefined ? null : left);
    this.right = (right === undefined ? null : right);
  }
}

// LeetCode tree test case
// 二叉树生成原理:递归依次遍历(左=>右),遇到 null 返回 (✅ null 后面不能有子节点了)
const BinaryTreeGenerator = (arr = [], i = 0): (TreeNode | null) => {
  if(i > arr.length || arr[i] === null) {
    return null;
  }
  const node = new TreeNode(arr[i]);
  // 先左后右, 依次遍历
  node.left = BinaryTreeGenerator(arr, 2 * i + 1);
  node.right = BinaryTreeGenerator(arr, 2 * i + 2);
  return node ;
}

/*

class TreeNode {
  constructor(val, left, right) {
    this.val = (val === undefined ? 0 : val);
    this.left = (left === undefined ? null : left);
    this.right = (right === undefined ? null : right);
  }
}


const BinaryTreeGenerator = (arr = [], i = 0): (TreeNode | null) => {
  if(i > arr.length || arr[i] === null) {
    return null;
  }
  const node = new TreeNode(arr[i]);
  node.left = BinaryTreeGenerator(arr, 2 * i + 1);
  node.right = BinaryTreeGenerator(arr, 2 * i + 2);
  return node ;
}

BinaryTreeGenerator([3,9,20,null,null,15,7]);

{
  "val": 3,
  "left": {
    "val": 9,
    "left": null,
    "right": null
  },
  "right": {
    "val": 20,
    "left": {
      "val": 15,
      "left": null,
      "right": null
    },
    "right": {
      "val": 7,
      "left": null,
      "right": null
    }
  }
}

https://leetcode.com/problems/maximum-depth-of-binary-tree/

*/

image

svg binary tree generator ?

image

SVG foreignObject

image

The <foreignObject> SVG element includes elements from a different XML namespace.
In the context of a browser, it is most likely (X)HTML.

https://developer.mozilla.org/en-US/docs/Web/SVG/Element/foreignObject

https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/foreignObject

solutions

ChatGPT ✅

https://chat.openai.com/chat

class TreeNode {
  constructor(val) {
    this.val = val;
    this.left = this.right = null;
  }
}

function createBinaryTree(arr, i = 0) {
  if (i >= arr.length || arr[i] === null) return null;
  let node = new TreeNode(arr[i]);
  node.left = createBinaryTree(arr, 2 * i + 1);
  node.right = createBinaryTree(arr, 2 * i + 2);
  return node;
}

const arr = [3, 9, 20, null, null, 15, 7];
const root = createBinaryTree(arr);
console.log(root);

https://leetcode.com/problems/maximum-depth-of-binary-tree/

https://stackoverflow.com/questions/75295344/its-possible-to-create-a-function-auto-generator-this-special-test-case-binary

todos

把生成的 binary tree 转换成 D3.js 可以识别的树形数据结构

// tree => tree_object

const specialTestCaseTree = {
  val: 3,
  left: {
    val: 9,
    left: null,
    right: null,
  },
  right: {
    val: 20,
    left: {
      val: 15,
      left: null,
      right: null,
    },
    right: {
      val: 7,
      left: null,
      right: null,
    },
  },
};

image

demos

gif

image

D3.js => SVG

// 破解,钻牛角尖

https://leetcode.com/problems/maximum-depth-of-binary-tree/description/

(🐞 反爬虫测试!打击盗版⚠️)如果你看到这个信息, 说明这是一篇剽窃的文章,请访问 https://www.cnblogs.com/xgqfrms/ 查看原创文章!

refs

https://www.cnblogs.com/xgqfrms/p/17089833.html

https://leetcode.com/problems/maximum-depth-of-binary-tree/

https://stackoverflow.com/questions/75295344/its-possible-to-create-a-function-auto-generator-this-special-test-case-binary?noredirect=1#comment132864363_75295344



©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用:只允许注册用户才可以访问!

原创文章,版权所有©️xgqfrms, 禁止转载 🈲️,侵权必究⚠️!


posted @ 2023-02-01 10:29  xgqfrms  阅读(24)  评论(7编辑  收藏  举报