Opções de simulação

Em Pivotick, a simulação física é parcialmente gerenciada para desempenho e estabilidade. Inclui:

• Pré-computação: o layout é simulado antes do gráfico ser renderizado, parando quando estiver quase estável.
• Execução temporizada: a simulação para automaticamente se for executada por muito tempo.
• Controle de partida/parada: o mecanismo evita que a simulação seja executada desnecessariamente em segundo plano.

Devido a esse comportamento controlado, adicionar nós após o término da simulação não executará novamente a física automaticamente. Se você modificar o gráfico dinamicamente, precisará "reaquecer" manualmente o layout para acionar uma nova passagem de simulação.

const graph = new Pivotick(container, data)
// Add nodes
graph.simulation.reheat(0.7) 

Ajuste automático de layout

Por padrão, Pivotick ajusta o layout para você. Em vez de aplicar um conjunto fixo de configurações de força a cada gráfico, ele as deriva do que realmente está na tela – quantos nós existem, quão grandes eles são e quão grande é a tela – e os deriva novamente sempre que isso muda. Quatro pequenos nós têm espaço para respirar; quarenta grandes ficam mais próximos sem se tocar.

Esta é a predefinição Auto e está ativada, a menos que você diga o contrário:

// Auto: no physics configured, so Pivotick tunes the layout as the graph changes.
new Pivotick(container, data)

// Manual: you set a physics option, so your value is kept and nothing re-tunes.
new Pivotick(container, data, { simulation: { d3LinkDistance: 200 } })

// Explicit, either way.
new Pivotick(container, data, { simulation: { physics: 'manual' } })
new Pivotick(container, data, { simulation: { physics: 'auto', d3LinkDistance: 200 } })

A regra é deliberadamente conservadora: definir qualquer opção que Auto aciona (d3LinkDistance, d3ManyBodyStrength, d3CollideRadiusMultiplier, d3VelocityDecay, d3GravityStrength, d3GravityStrengthConnected, d3AlphaDecay, cooldownTime) desativa Auto para esse gráfico, para que uma configuração existente nunca seja silenciosamente assumida. physics: 'auto' ao lado de opções explícitas ainda é legal - os valores explícitos propagam o quadro de abertura e Auto assume a partir daí.

Auto apenas move os mesmos botões que o menu desdobrável de Física expõe, e os controles deslizantes acompanham enquanto ele é reajustado, para que suas decisões fiquem visíveis em vez de ocultas. Girar qualquer botão você mesmo - um controle deslizante, uma chamada set* ou as predefinições Tight/Loose - o leva de volta para sempre; nada será reajustado à sua escolha posteriormente.

Mais duas notas:

• Auto é apenas layout forçado. Em tree / egoTree não faz nada, porque o espaçamento das árvores é da responsabilidade do layout.
• Auto nunca reinicia uma simulação que está pausada (ou que o watchdog lento está desligado). Ainda funciona nos botões; simplesmente não acorda nada.

dica

Fixar physics: 'manual' é a escolha certa para testes de captura de tela e miniaturas, onde você deseja sempre a mesma imagem, independentemente do tamanho do gráfico.

Opções

As opções de Simulação controlam o comportamento físico e de layout de nós e arestas para o mecanismo de simulação de gráfico.

Verifique a documentação oficial D3-force para saber mais.

Opção	Tipo	Padrão	Descrição
userWorker	booleano	true	O cálculo inicial do posicionamento do nó deve ser feito por um web trabalhador
enabled	booleano	true	A simulação deve estar em execução
physics	'auto' | 'manual'	'auto'†	Quem controla as configurações de força — consulte Ajuste automático de layout.
warmupTicks	número | 'auto'	'auto'	Marca o layout de abertura antes do primeiro quadro. 0 não executa nenhum, então os nós que recebem um x/y abrem onde estavam e a física automática é reajustada sem movê-los até que o gráfico mude.
d3Alpha	número	1.0	Simulação inicial alfa
d3AlphaMin	número	0.001	Valor alfa mínimo antes da simulação parar.
d3VelocityDecay	número	0.4	Atrito aplicado às velocidades dos nós.
d3LinkDistance	número	30	Distância padrão entre nós conectados.
freezeNodesOnDrag	booleano	true	Se os nós são congelados quando são liberados de uma operação de arrastar.
callbacks	SimulationCallbacks	undefined	Ganchos para responder a eventos de simulação.

† 'auto' somente para gráficos que não configuram nenhuma das opções Auto drives; consulte Ajuste automático de layout.

informações

Outros parâmetros de força D3 como d3AlphaDecay, d3ManyBodyStrength, d3CollideRadius estão disponíveis e documentados na referência da API.

Retornos de chamada

• onInit(sim: Simulation): Chamado quando a simulação é inicializada.
• onStart(sim: Simulation): Chamado quando a simulação começa a ser executada.
• onStop(sim: Simulation): Chamado quando a simulação para.
• onTick(sim: Simulation): Chamado em cada tick da simulação.

API

Pivotick expõe um controlador de simulação que permite interagir diretamente com o mecanismo de física. Todos os métodos estão disponíveis online

Parar/Iniciar

pause(): void;
reheat(alpha?: number): void;
restart(): void;
start(): Promise<void>;
stop(): void;

Alterando layout

changeLayout method

changeLayout(
    type: LayoutType,
    simulationOptions?: DeepPartial<SimulationOptions.SimulationOptions>,
): Promise<void>;

Change layour to a tree

graph.simulation.changeLayout('tree', {
    layout: {
         horizontal: false,
         rootIdAlgorithmFinder: 'FirstZeroInDegree'
    }
})

Retorno de chamada de estabilização

waitForSimulationStop method

waitForSimulationStop(): Promise<void>;

Change layour to a tree

graph.simulation.reheat(0.7)
// Wait until the simulation stops
await graph.simulation.waitForSimulationStop()
graph.renderer.fitAndCenter()