react-kggraph 0.0.11 → 0.0.12

package/lib/index.es8.js

@@ -1,324 +1,423 @@
-import { message as C } from "antd";
-import j from "./index.es23.js";
-import I from "./index.es24.js";
-import P from "./index.es25.js";
-import $ from "./index.es26.js";
-import D from "./index.es27.js";
-import J from "./index.es28.js";
-import N from "./index.es29.js";
-import R from "./index.es30.js";
-import q from "./index.es31.js";
-import A from "./index.es32.js";
-import B from "./index.es33.js";
-import { jsonStringifyParse as U } from "./index.es12.js";
-const L = [j, I, P, $, D, J, N, R, q, A], G = (c) => {
-  let o = {};
-  const s = {}, e = [];
-  return c.forEach((n) => {
-    var a;
-    const { group: d } = n;
-    if (d === "nodes") {
-      const r = n.data, l = (a = r.properties) == null ? void 0 : a.type, i = r.type;
-      !i && l === "uri" || (!e.includes(i) && l === "uri" ? (e.push(i), o = { ...o, [i]: { ...o[i], count: 1, img: r.image } }) : l === "uri" && i && (o = { ...o, [i]: { ...o[i], img: r.image, count: o[i].count + 1 } }));
-    } else if (d === "edges") {
-      const r = n.data, { label: l } = r;
-      s[l] ? s[l] = s[l] + 1 : s[l] = 1;
-    } else
-      console.log("nonono");
-  }), {
-    typeListArr: e,
-    typeListObj: o,
-    relationListObj: s
-  };
-}, te = (c, { graphData: o = [], typeObj: s, zktype: e, graphInfo: n = {} }) => {
-  let d = U(s);
-  const a = Object.keys(s), r = n.searchNodes || [], l = new Set(
-    (o == null ? void 0 : o.map((g) => {
-      var t, m, h;
-      return g.group === "nodes" ? (t = g.data) == null ? void 0 : t.id : ((m = g.data) == null ? void 0 : m.source) + "-" + ((h = g.data) == null ? void 0 : h.target);
-    }).filter(Boolean)) || []
-  ), { nodes: i = [], links: p = [] } = c || {}, y = [], k = (g) => {
-    g.forEach((t) => {
-      var m, h;
-      if (!l.has(t.id)) {
-        const v = (m = t.properties) == null ? void 0 : m.type, f = t.type, E = t.label.split("#").pop();
-        let w = -1;
-        if (!f && v === "uri")
-          w = t.image || L[0];
-        else if (!a.includes(f) && v === "uri") {
-          a.push(f);
-          const O = a.indexOf(f);
-          w = t.image || L[O] || L[0], d = { ...d, [f]: { ...d[f], img: w } };
-        } else v === "uri" && f && (w = (h = d[f]) == null ? void 0 : h.img);
-        const S = {
-          ...t,
-          name: E,
-          "properties-type": v,
-          image: r.includes(E) ? B : w,
-          baseWidth: 80,
-          // 保存基础宽度
-          baseHeight: 80
-          // 保存基础高度
-        };
-        y.push({ group: "nodes", data: S });
-      }
+const I = (e, n, r, o = 20) => {
+  const u = e.nodes(), i = u.filter((t) => t.data("name") === n), a = u.filter((t) => t.data("name") === r);
+  if (console.log(111, !i.data() || !a.data(), i.data(), a.data()), !i.data() || !a.data()) {
+    console.warn("fixNodesToEdges: 未找到左右节点", n, r);
+    const t = e.layout(c());
+    return t.run(), t.on("layoutstop", () => {
+      e.fit(void 0, 50);
+    }), !1;
+  }
+  const l = e.width();
+  if (l === 0)
+    return !1;
+  const g = i.width() || 60, d = e.height() / 2, f = g / 2 + o, m = l - g / 2 - o;
+  i.position({ x: f, y: d }), a.position({ x: m, y: d }), i.lock(), a.lock();
+  const s = e.nodes().difference(i).difference(a);
+  if (s.length > 0) {
+    s.forEach((v) => {
+      const p = v.position().x, h = Math.min(f, p), b = Math.max(m, p);
+      v.position({
+        x: h + (b - h) * 0.5,
+        y: d
+      });
     });
-  };
-  ((g) => {
-    g.forEach((t) => {
-      const { label: m } = t, h = `${t.source}-${t.target}`;
-      l.has(h) || y.push({ group: "edges", data: { ...t, name: m, zktype: e } });
+    const t = e.layout({
+      // name: 'cose-bilkent',
+      ...c(),
+      nodes: s
+      // 只布局中间节点
+      // animate: true,
+      // animationDuration: 500,
+      // randomize: false,
+      // fit: false, // 不自动适应视图
+      // nodeRepulsion: 1500000,
+      // idealEdgeLength: 120,
+      // gravity: 0.3,
+      // padding: 50,
     });
-  })(p), k(i);
-  const { typeListObj: u, relationListObj: x } = G([...y, ...o]);
-  return {
-    elements: y,
-    typeListObj: u,
-    relationListObj: x
-  };
-}, oe = (c, o) => {
-  const s = c.current;
-  if (!s) return;
-  let e = {
-    color: "#000"
-  };
-  switch (o) {
-    case "center":
-      e = {
-        "text-halign": "center",
-        "text-valign": "center"
-        // 'color': '#fff',
-      };
+    t.run(), t.on("layoutstop", () => {
+      e.fit(void 0, 50), i.unlock(), a.unlock(), console.log("布局完成");
+    });
+  } else
+    e.fit(void 0, 50);
+  return console.log("fixNodesToEdges: 完成"), !0;
+}, c = () => ({
+  name: "cose-bilkent",
+  // 核心优化
+  nodeRepulsion: 1005e3,
+  // 大幅增加斥力，让节点分散
+  idealEdgeLength: 100,
+  // 拉长边长，避免拥挤
+  edgeElasticity: 0.3,
+  // 适度弹性，保持边距
+  numIter: 2500,
+  // 保持迭代次数
+  // 布局对齐
+  fit: !0,
+  padding: 50,
+  // 增加内边距
+  randomize: !1,
+  animate: "end",
+  //fit、none
+  animationDuration: 1e3,
+  // 辅助优化
+  nodeDimensionsIncludeLabels: !0,
+  // 让节点自动适应标签长度
+  tile: !0,
+  tilingPaddingVertical: 15,
+  tilingPaddingHorizontal: 15,
+  gravity: 0.6,
+  // 稍强的向心力，避免过于分散
+  // 其他保持默认
+  nestingFactor: 0.1,
+  gravityRange: 3,
+  gravityRangeCompound: 1.5,
+  gravityCompound: 1,
+  initialEnergyOnIncremental: 0.5,
+  refresh: 30
+}), w = (e, n) => {
+  console.log(111, n);
+  const r = e.current;
+  if (!r) return;
+  let o = {};
+  switch (n) {
+    case "circle":
+      o = E();
       break;
-    case "left":
-      e = {
-        ...e,
-        "text-halign": "left",
-        "text-valign": "center",
-        "text-margin-x": "-5px"
-      };
+    case "concentric":
+      console.log("执行圆形布局"), o = L();
       break;
-    case "right":
-      e = {
-        ...e,
-        "text-halign": "right",
-        "text-valign": "center",
-        "text-margin-x": "5px"
-      };
+    case "grid":
+      console.log("执行网格布局"), o = D();
       break;
-    case "top":
-      e = {
-        ...e,
-        "text-halign": "center",
-        "text-valign": "top",
-        "text-margin-y": "-5px"
-      };
+    case "breadthfirst":
+      console.log("执行树型布局"), o = F();
+      break;
+    case "random":
+      console.log("执行随机布局"), o = y();
+      break;
+    case "cose":
+      console.log("执行 cose 布局"), o = k();
+      break;
+    case "cose-bilkent":
+      console.log("执行 cose-bilkent 布局"), o = c();
       break;
-    case "bottom":
-      e = {
-        ...e,
-        "text-halign": "center",
-        "text-valign": "bottom",
-        "text-margin-y": "5px"
+    case "fcose":
+      console.log("执行 fcose 布局"), o = x();
+      break;
+    case "cise":
+      console.log("执行 cise 布局"), o = {
+        name: "cise",
+        // 聚类分组（必须定义才能生效）
+        clusters: [],
+        // 关闭动画，避免抖动
+        animate: !1,
+        // 布局完成后适应画布
+        fit: !0,
+        // 内边距
+        padding: 30,
+        // 节点间距
+        nodeSeparation: 80,
+        // 理想边长
+        idealEdgeLength: 80,
+        // 聚类间边长度系数
+        idealInterClusterEdgeLengthCoefficient: 1.5,
+        // 最大迭代次数
+        maxIteration: 500
       };
       break;
-  }
-  s.nodes().style(e), s.style().update();
-}, ne = async (c, { pathNodes: o, isGrayed: s = !0 }) => {
-  const e = c.current;
-  if (!e)
-    return;
-  if ((o == null ? void 0 : o.length) < 2) {
-    C.warning("请至少设置 2 个路径节点！");
-    return;
-  }
-  if ([...new Set(o)].length !== o.length) {
-    C.warning("路径中存在重复节点，请检查！");
-    return;
-  }
-  const d = [];
-  for (const a of o) {
-    const r = e.nodes().filter((l) => l.data("name") === a);
-    if (r.length > 0)
-      d.push(r.id());
-    else {
-      e.nodes().removeClass("path-node"), e.edges().removeClass("path-edge"), C.warning(`找不到节点：${a}`);
+    default:
+      console.warn("未知布局类型：", n);
       return;
-    }
   }
-  try {
-    e.nodes().removeClass("path-node").removeClass("grayed"), e.edges().removeClass("path-edge").removeClass("grayed");
-    let a = e.collection(), r = 0, l = !0;
-    const i = [];
-    for (let p = 0; p < d.length - 1; p++) {
-      const y = d[p], k = d[p + 1], b = e.getElementById(y), u = e.getElementById(k), x = b.edgesWith(u).filter(function(t) {
-        return t.data("source") === y && t.data("target") === k;
-      }), g = u.edgesWith(b).filter(function(t) {
-        return t.data("source") === k && t.data("target") === y;
-      });
-      if (x.length > 0 || g.length > 0) {
-        const t = x.add(g);
-        a = a.union(t).union(b).union(u), r += t.length, b.addClass("path-node"), u.addClass("path-node"), t.addClass("path-edge"), i.push(b.data("name"), u.data("name")), console.log(`找到直接连接的边：正向${x.length}条，反向${g.length}条`);
-      } else {
-        const t = e.elements().aStar({
-          root: b,
-          goal: u,
-          directed: !1
-        });
-        if (t.found && t.path) {
-          a = a.union(t.path), r += t.distance, t.path.nodes().addClass("path-node"), t.path.edges().addClass("path-edge");
-          const m = t.path.nodes().map((h) => h.data("name"));
-          i.push(...m);
-        } else {
-          l = !1, console.log(`节点 ${o[p]} 和 ${o[p + 1]} 之间没有路径`);
-          break;
-        }
-      }
-    }
-    if (l && a.length > 0) {
-      const p = a.nodes(), y = a.edges();
-      p.addClass("path-node"), y.addClass("path-edge"), s && (e.nodes().not(p).addClass("grayed"), e.edges().not(y).addClass("grayed"));
-    } else
-      C.warning("无法找到完整的路径！");
-  } catch (a) {
-    console.error(2e3, "计算路径时出错：", a), C.warning("计算路径时出错，请重试！");
+  r.layout(o).run();
+}, y = () => ({
+  name: "random",
+  fit: !0,
+  // whether to fit to viewport
+  padding: 30,
+  // fit padding
+  boundingBox: void 0,
+  // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
+  animate: !0,
+  // whether to transition the node positions
+  animationDuration: 500,
+  // duration of animation in ms if enabled
+  animationEasing: void 0,
+  // easing of animation if enabled
+  animateFilter: function(e, n) {
+    return !0;
+  },
+  // a function that determines whether the node should be animated.  All nodes animated by default on animate enabled.  Non-animated nodes are positioned immediately when the layout starts
+  ready: void 0,
+  // callback on layoutready
+  stop: void 0,
+  // callback on layoutstop
+  transform: function(e, n) {
+    return n;
   }
-}, T = (c) => {
-  const o = c.nodes().map((n) => ({
-    data: n.data(),
-    position: n.position(),
-    style: {
-      width: n.style("width"),
-      height: n.style("height"),
-      backgroundColor: n.style("background-color")
-    }
-  })), s = c.edges().map((n) => ({
-    data: n.data(),
-    style: {
-      width: n.style("width"),
-      "line-color": n.style("line-color"),
-      "target-arrow-color": n.style("target-arrow-color")
-    }
-  }));
-  return { nodes: o, edges: s };
-}, ae = (c) => {
-  const o = T(c), s = new Blob([JSON.stringify(o, null, 2)], { type: "application/json" }), e = URL.createObjectURL(s), n = document.createElement("a");
-  n.href = e, n.download = `graph-data-${Date.now()}.json`, n.click(), URL.revokeObjectURL(e);
-}, se = [
-  {
-    label: "网络布局",
-    key: "cose-bilkent"
+  // transform a given node position. Useful for changing flow direction in discrete layouts 
+}), k = () => ({
+  name: "cose",
+  ready: function() {
   },
-  {
-    label: "弹性布局",
-    key: "fcose"
+  stop: function() {
   },
-  {
-    label: "网格布局",
-    key: "grid"
+  animate: !0,
+  animationEasing: void 0,
+  animationDuration: void 0,
+  animateFilter: function(e, n) {
+    return !0;
   },
-  {
-    label: "球面布局",
-    key: "circle"
+  animationThreshold: 250,
+  refresh: 20,
+  fit: !0,
+  padding: 30,
+  boundingBox: void 0,
+  nodeDimensionsIncludeLabels: !1,
+  randomize: !1,
+  componentSpacing: 40,
+  nodeRepulsion: function(e) {
+    return 2048;
   },
-  {
-    label: "层级布局",
-    key: "breadthfirst"
+  nodeOverlap: 4,
+  idealEdgeLength: function(e) {
+    return 32;
   },
-  {
-    label: "同心圆布局",
-    key: "concentric"
-  }
-], le = [
-  {
-    label: "查询节点",
-    key: "query",
-    func: "queryNode"
+  edgeElasticity: function(e) {
+    return 32;
   },
-  {
-    label: "连接分析",
-    key: "link",
-    func: "onLevelClick"
+  nestingFactor: 1.2,
+  gravity: 1,
+  numIter: 8e3,
+  initialTemp: 1e3,
+  coolingFactor: 0.99,
+  minTemp: 1
+}), E = () => ({
+  name: "circle",
+  fit: !0,
+  // whether to fit the viewport to the graph
+  padding: 30,
+  // the padding on fit
+  boundingBox: void 0,
+  // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
+  avoidOverlap: !0,
+  // prevents node overlap, may overflow boundingBox and radius if not enough space
+  nodeDimensionsIncludeLabels: !1,
+  // Excludes the label when calculating node bounding boxes for the layout algorithm
+  spacingFactor: 1.2,
+  // 节点间距系数，值越大连线越长
+  radius: void 0,
+  // the radius of the circle
+  startAngle: 1.5 * Math.PI,
+  // where nodes start in radians
+  sweep: void 0,
+  // how many radians should be between the first and last node (defaults to full circle)
+  clockwise: !0,
+  // whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false)
+  sort: void 0,
+  // a sorting function to order the nodes; e.g. function(a, b){ return a.data('weight') - b.data('weight') }
+  animate: !0,
+  // whether to transition the node positions
+  animationDuration: 500,
+  // duration of animation in ms if enabled
+  animationEasing: void 0,
+  // easing of animation if enabled
+  animateFilter: function(e, n) {
+    return !0;
   },
-  {
-    label: "路径分析",
-    key: "path",
-    func: "pathAnalysis"
+  // a function that determines whether the node should be animated.  All nodes animated by default on animate enabled.  Non-animated nodes are positioned immediately when the layout starts
+  ready: void 0,
+  // callback on layoutready
+  stop: void 0,
+  // callback on layoutstop
+  transform: function(e, n) {
+    return n;
   }
-], re = [
-  {
-    label: "全选",
-    key: "all"
+  // transform a given node position. Useful for changing flow direction in discrete layouts 
+}), L = () => ({
+  name: "concentric",
+  fit: !0,
+  // whether to fit the viewport to the graph
+  padding: 30,
+  // the padding on fit
+  startAngle: 1.5 * Math.PI,
+  // where nodes start in radians
+  sweep: void 0,
+  // how many radians should be between the first and last node (defaults to full circle)
+  clockwise: !0,
+  // whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false)
+  equidistant: !1,
+  // whether levels have an equal radial distance betwen them, may cause bounding box overflow
+  minNodeSpacing: 10,
+  // min spacing between outside of nodes (used for radius adjustment)
+  boundingBox: void 0,
+  // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
+  avoidOverlap: !0,
+  // prevents node overlap, may overflow boundingBox if not enough space
+  nodeDimensionsIncludeLabels: !1,
+  // Excludes the label when calculating node bounding boxes for the layout algorithm
+  height: void 0,
+  // height of layout area (overrides container height)
+  width: void 0,
+  // width of layout area (overrides container width)
+  spacingFactor: 3,
+  // Applies a multiplicative factor (>0) to expand or compress the overall area that the nodes take up
+  concentric: function(e) {
+    return e.degree();
   },
-  {
-    label: "反选",
-    key: "reverse"
+  levelWidth: function(e) {
+    return e.maxDegree() / 4;
   },
-  {
-    label: "点选模式",
-    key: "click"
+  animate: !0,
+  // whether to transition the node positions
+  animationDuration: 500,
+  // duration of animation in ms if enabled
+  animationEasing: void 0,
+  // easing of animation if enabled
+  animateFilter: function(e, n) {
+    return !0;
   },
-  {
-    label: "框选模式",
-    key: "box"
+  // a function that determines whether the node should be animated.  All nodes animated by default on animate enabled.  Non-animated nodes are positioned immediately when the layout starts
+  ready: void 0,
+  // callback on layoutready
+  stop: void 0,
+  // callback on layoutstop
+  transform: function(e, n) {
+    return n;
   }
-], ie = [
-  {
-    label: "下载JSON",
-    key: "downloadJson"
-  },
-  {
-    label: "预览JSON列表",
-    key: "previewJsonList"
-  },
-  {
-    label: "下载EXCEL",
-    key: "downloadExcel"
+  // transform a given node position. Useful for changing flow direction in discrete layouts
+}), x = () => ({
+  name: "fcose",
+  // 节点布局 - 防止重叠
+  idealEdgeLength: 50,
+  // 较小的边长
+  edgeElasticity: 80,
+  // 边的弹性
+  nodeRepulsion: 12e3,
+  // 增强斥力，防止重叠
+  nodeOverlap: 0,
+  // 不允许重叠
+  spacingFactor: 2,
+  // 间距
+  nestingFactor: 5,
+  // 嵌套因子
+  gravity: 0,
+  // 无中心引力
+  numIter: 3e3,
+  // 增加迭代次数
+  tile: !0,
+  // 平铺布局
+  animate: "end",
+  // 动画时机
+  animationDuration: 1e3,
+  // 动画时长
+  randomize: !0,
+  // 随机初始位置
+  fit: !0,
+  // 是否适应画布
+  padding: 50,
+  // 内边距
+  nodeDimensionsIncludeLabels: !0
+}), D = () => ({
+  name: "grid",
+  fit: !0,
+  // whether to fit the viewport to the graph
+  padding: 30,
+  // padding used on fit
+  boundingBox: void 0,
+  // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
+  avoidOverlap: !0,
+  // prevents node overlap, may overflow boundingBox if not enough space
+  avoidOverlapPadding: 10,
+  // extra spacing around nodes when avoidOverlap: true
+  nodeDimensionsIncludeLabels: !1,
+  // Excludes the label when calculating node bounding boxes for the layout algorithm
+  spacingFactor: void 0,
+  // Applies a multiplicative factor (>0) to expand or compress the overall area that the nodes take up
+  condense: !1,
+  // uses all available space on false, uses minimal space on true
+  rows: void 0,
+  // force num of rows in the grid
+  cols: void 0,
+  // force num of columns in the grid
+  position: function(e) {
   },
-  // {
-  //   label: '预览数据列表',
-  //   key: 'previewDataList' 
-  // },
-  {
-    label: "下载JPG",
-    key: "downloadJpg"
+  // returns { row, col } for element
+  sort: void 0,
+  // a sorting function to order the nodes; e.g. function(a, b){ return a.data('weight') - b.data('weight') }
+  animate: !0,
+  // whether to transition the node positions
+  animationDuration: 500,
+  // duration of animation in ms if enabled
+  animationEasing: void 0,
+  // easing of animation if enabled
+  animateFilter: function(e, n) {
+    return !0;
   },
-  {
-    label: "下载PNG",
-    key: "downloadPng"
+  // a function that determines whether the node should be animated.  All nodes animated by default on animate enabled.  Non-animated nodes are positioned immediately when the layout starts
+  ready: void 0,
+  // callback on layoutready
+  stop: void 0,
+  // callback on layoutstop
+  transform: function(e, n) {
+    return n;
   }
-], ce = [
-  {
-    label: "居中",
-    key: "center"
-  },
-  {
-    label: "顶部",
-    key: "top"
-  },
-  {
-    label: "底部",
-    key: "bottom"
-  },
-  {
-    label: "左侧",
-    key: "left"
+  // transform a given node position. Useful for changing flow direction in discrete layouts 
+}), F = () => ({
+  name: "breadthfirst",
+  fit: !0,
+  // whether to fit the viewport to the graph
+  directed: !1,
+  // whether the tree is directed downwards (or edges can point in any direction if false)
+  direction: "downward",
+  // determines the direction in which the tree structure is drawn.  The possible values are 'downward', 'upward', 'rightward', or 'leftward'.
+  padding: 30,
+  // padding on fit
+  circle: !1,
+  // put depths in concentric circles if true, put depths top down if false
+  grid: !1,
+  // whether to create an even grid into which the DAG is placed (circle:false only)
+  spacingFactor: 1,
+  // 值越小连线越短
+  boundingBox: void 0,
+  // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
+  avoidOverlap: !0,
+  // prevents node overlap, may overflow boundingBox if not enough space
+  nodeDimensionsIncludeLabels: !1,
+  // Excludes the label when calculating node bounding boxes for the layout algorithm
+  roots: void 0,
+  // the roots of the trees
+  depthSort: void 0,
+  // a sorting function to order nodes at equal depth. e.g. function(a, b){ return a.data('weight') - b.data('weight') }
+  animate: !0,
+  // whether to transition the node positions
+  animationDuration: 500,
+  // duration of animation in ms if enabled
+  animationEasing: void 0,
+  // easing of animation if enabled,
+  animateFilter: function(e, n) {
+    return !0;
   },
-  {
-    label: "右侧",
-    key: "right"
+  // a function that determines whether the node should be animated.  All nodes animated by default on animate enabled.  Non-animated nodes are positioned immediately when the layout starts
+  ready: void 0,
+  // callback on layoutready
+  stop: void 0,
+  // callback on layoutstop
+  transform: function(e, n) {
+    return n;
   }
-];
+  // transform a given node position. Useful for changing flow direction in discrete layouts
+});
 export {
-  re as choiceConfig,
-  ae as donwnGraphData,
-  ie as downloadData,
-  T as getCyData,
-  ne as handleCalcPath,
-  L as imageMap,
-  se as layoutCongig,
-  le as linkAnalysis,
-  te as resDetailData,
-  oe as textLayout,
-  ce as textPositionConfig
+  F as breadthfirstLayout,
+  E as circle,
+  L as concentricLayout,
+  c as coseBilkentLayout,
+  k as coseLayout,
+  x as fcoseLayout,
+  I as fixNodesToEdges,
+  D as gridLayout,
+  w as layout,
+  y as randomLayout
 };