TypeScript d3-force.forceCenter函数代码示例

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

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

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

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

示例1:

let context = canvas.getContext('2d');
let width = canvas.width;
let height = canvas.height;

// -------------------------------------------------------------------------------------
// Test Pre-Defined Forces
// -------------------------------------------------------------------------------------

// Centering ===========================================================================

// create Centering force --------------------------------------------------------------

let forceCenter: d3Force.ForceCenter<SimNode>;

// without specified center point (i.e. defaults to [0, 0])
forceCenter = d3Force.forceCenter<SimNode>();

// with x-coordinate of center point
forceCenter = d3Force.forceCenter<SimNode>(100);

// with x- and y-coordinate of center point
forceCenter = d3Force.forceCenter<SimNode>(100, 100);

// Configure Centering force -----------------------------------------------------------

forceCenter = forceCenter.x(150);
num = forceCenter.x();

forceCenter = forceCenter.y(150);
num = forceCenter.y();

开发者ID:ArtemZag，项目名称:DefinitelyTyped，代码行数:30，代码来源:d3-force-tests.ts

示例2: ForceDirected

export function ForceDirected(graphData: GraphData, width, height, options) {
    options = options || {};
    const context = this;
    this.pos = {};

    this.vertices = [];
    this.vertexMap = {};
    graphData.eachNode(function (u) {
        const vertex = graphData.node(u);
        const size = vertex.getBBox();
        const newItem = {
            id: u,
            x: vertex.pos().x,
            y: vertex.pos().y,
            width: size.width,
            height: size.height,
            value: vertex
        };
        context.vertices.push(newItem);
        context.vertexMap[u] = newItem;
    });
    this.edges = [];
    graphData.eachEdge(function (_e, s, t) {
        context.edges.push({
            source: s,
            target: t
        });
    });
    const forceLink = d3ForceLink()
        .id(function (d: any) {
            return d.id;
        })
        .distance(options.linkDistance)
        .strength(options.linkStrength)
        ;
    const forceManyBody = d3ForceManyBody()
        .strength(function (d: any) {
            const cs = d.value.getBBox();
            return options.charge * Math.max(cs.width, cs.height);
        })
        ;
    this.force = d3ForceSimulation()
        .force("link", forceLink)
        .force("charge", forceManyBody)
        .force("center", d3ForceCenter(width / 2, height / 2))
        .velocityDecay(options.oneShot ? 0.1 : options.friction)
        .nodes(this.vertices)
        ;
    forceLink
        .links(this.edges)
        ;

    if (options.oneShot) {
        this.force.restart();
        let total = graphData.nodeCount();
        total = Math.min(total * total, 500);
        for (let i = 0; i < total; ++i) {
            this.force.tick();
        }
        this.force.stop();
    }
}

开发者ID:GordonSmith，项目名称:Visualization，代码行数:62，代码来源:GraphLayouts.ts

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