本文整理匯總了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();
示例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();
}
}