• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript d3-hierarchy.tree函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中d3-hierarchy.tree函数的典型用法代码示例。如果您正苦于以下问题:TypeScript tree函数的具体用法?TypeScript tree怎么用?TypeScript tree使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了tree函数的3个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: makeHierarchyTree

export function makeHierarchyTree(t : IProofTree) : d3Hierarchy.HierarchyPointNode<IProofTreeNode> {
  const hierarchyRoot = d3Hierarchy.hierarchy(
    t.rootNode,
    (node : IProofTreeNode) => {
      console.log('Computing some children')
      // fake nodes are used to trick the layout engine into spacing
      // childrenless nodes appropriately
      if (node instanceof FakeNode) { return [] }
      const viewChildren = node.getViewChildren()
      // in order to trick d3 into displaying tactics better add fake
      // children to tactic nodes that solve their goal
      if (node instanceof TacticGroupNode && viewChildren.length === 0) {
        return [new FakeNode(t, node)]
      }
      if (viewChildren === undefined) {
        debugger
      }
      return viewChildren
    }
  )
  return d3Hierarchy.tree<IProofTreeNode>()
    .separation(d => {
      // TODO: now that I put fake nodes, still need this?
      // TODO: this just won't work, need invisible children
      // for tactics without children
      return 1 / (1 + Math.pow(d.depth, 3))
    })
    (hierarchyRoot)
}
开发者ID:Ptival,项目名称:PeaCoq,代码行数:29,代码来源:utils.ts


示例2: constructor

  constructor(graphId:string, div: any, config: any={}) {
    this.i = 0;

    let defaultConfig: TrialConfig = {
      customSize: function(g:TrialGraph) {
        return [
          g.config.width,
          g.config.height,
        ]
      },
      customMouseOver: (g:TrialGraph, d: VisibleTrialNode, name: string) => false,
      customMouseOut: (g:TrialGraph, d: VisibleTrialNode) => false,
      customForm: (g: TrialGraph, form: d3_Selection<d3_BaseType, {}, HTMLElement | null, any>) => null,

      duration: 750,

      top: 50,
      right: 30,
      bottom: 80,
      left: 30,

      width: 900,
      height: 500,

      useTooltip: false,
      fontSize: 10,
      labelFontSize: 10,

      nodeSizeX: 47,
      nodeSizeY: 100,
    };
    this.config = (Object as any).assign({}, defaultConfig, config);


    this.graphId = graphId;

    this.zoom = d3_zoom()
      .on("zoom", () => this.zoomFunction())
      .on("start", () => d3_select('body').style("cursor", "move"))
      .on("end", () => d3_select('body').style("cursor", "auto"))
      .wheelDelta(() => {
        return -d3_event.deltaY * (d3_event.deltaMode ? 120 : 1) / 2000;
      })

    this.div = d3_select(div)
    let form = d3_select(div)
      .append("form")
      .classed("trial-toolbar", true);

    this.svg = d3_select(div)
      .append("div")
      .append("svg")
      .attr("width", this.config.width)
      .attr("height", this.config.height)
      .call(this.zoom);

    this.createMarker('end', 'enormal', 'black');
    this.createMarker('endbefore', 'ebefore', 'red');
    this.createMarker('endafter', 'eafter', 'green');

    this.g = this.svg.append("g")
      .attr("id", this._graphId())
      .attr("transform", "translate(0,0)")
      .classed('TrialGraph', true);

    this.tree = d3_tree()
      .nodeSize([
        this.config.nodeSizeX,
        this.config.nodeSizeY
      ]);

    // **Toolbar**
    this.createToolbar(form);

    // Tooltip
    this.tooltipDiv = d3_select("body").append("div")
      .attr("class", "now-tooltip now-trial-tooltip")
      .style("opacity", 0)
      .on("mouseout", () => {
        this.closeTooltip();
      });

    // Zoom
    this.svg
      .call(this.zoom.transform, d3_zoomIdentity.translate(
        this.config.left + this.config.width / 2,
        this.config.top
      ))
  }
开发者ID:gems-uff,项目名称:noworkflow,代码行数:89,代码来源:graph.ts


示例3:

});

// copy() --------------------------------------------------------------------

let copiedClusterNode: d3Hierarchy.HierarchyPointNode<HierarchyDatumWithParentId>;
copiedClusterNode = clusterRootNode.copy();

// -----------------------------------------------------------------------
// Tree
// -----------------------------------------------------------------------

// Create tree layout generator =======================================

let treeLayout: d3Hierarchy.TreeLayout<HierarchyDatumWithParentId>;

treeLayout = d3Hierarchy.tree<HierarchyDatumWithParentId>();

// Configure tree layout generator ====================================

// size() ----------------------------------------------------------------

treeLayout = treeLayout.size(null);
treeLayout = treeLayout.size([200, 200]);

size = treeLayout.size();

// nodeSize() ------------------------------------------------------------

treeLayout = treeLayout.nodeSize(null);
treeLayout = treeLayout.nodeSize([10, 10]);
size = treeLayout.nodeSize();
开发者ID:HawkHouseIntegration,项目名称:DefinitelyTyped,代码行数:31,代码来源:d3-hierarchy-tests.ts



注:本文中的d3-hierarchy.tree函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript d3-hsv.hsv函数代码示例发布时间:2022-05-25
下一篇:
TypeScript d3-hierarchy.packSiblings函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap