Pivotick API
A lista de métodos está disponível online.
Obtendo nós e arestas
Pivotick fornece várias maneiras de acessar nós e arestas. Os métodos para nós estão listados abaixo (as arestas funcionam da mesma maneira):
| Método | Retorno | Descrição |
|---|---|---|
getNode(id: string | Node) | Node | undefined | Retorna uma cópia profunda do nó com o ID fornecido. |
getNodes() | Node[] | Retorna uma cópia profunda de todos os nós. |
getMutableNode(id: string | Node) | Node | undefined | Retorna o objeto do nó real usado internamente por Pivotick. |
getMutableNodes() | Node[] | Retorna todos os objetos do nó interno. |
dica
Use os getters padrão (getNode / getNodes) sempre que possível. Eles fornecem clones seguros que podem ser modificados sem afetar o estado interno do mecanismo.
perigo
Modificar nós ou arestas diretamente por meio dos getters mutáveis pode levar a comportamento inesperado. Use acesso mutável apenas se você entender a mecânica interna do motor; caso contrário, prefira as versões clonadas.
Adicionando nós e arestas
Você pode usar as funções addNode() e addEdge() na instância do gráfico para criar novos nós e arestas.
async function addNode(counter, graph) {
const newNode = new Node(`n-${counter}`, { label: `Node ${counter}` })
const existingNodes = graph.getMutableNodes()
const randomIndex = Math.floor(Math.random() * existingNodes.length)
const randomNode = existingNodes[randomIndex]
const newEdge = new Edge(`e-${counter}`, randomNode, newNode)
graph.addNode(newNode)
graph.addEdge(newEdge)
// Restart physics by nudging the graph a bit
graph.simulation.reheat(0.7)
await graph.simulation.waitForSimulationStop()
graph.renderer.fitAndCenter()
}function loaded(graph) {
let i = graph.getMutableNodes().length
addNode(i++, graph)
setInterval(() => {
if (i < 10) {
addNode(i++, graph)
}
}, 1500)
}Notas
As notas assumem opções simples, com o mesmo formato de data.notes, portanto, um conjunto armazenado pode ser desenhado a qualquer momento, não apenas quando o gráfico é construído.
| Método | Retorno | Descrição |
|---|---|---|
addNote(options: NoteOptions | Note) | Note | undefined | Adiciona e desenha uma nota e emite noteAdd. Lança se o ID for obtido. Retorna undefined enquanto UI.notes.enabled é false. |
setNotes(notes: NoteOptions[]) | Note[] | Substitui as notas, deixando nós e arestas sozinhos. As notas são correspondidas por id: uma nota que já está na tela é atualizada, uma que está faltando na lista é removida e uma nova é adicionada. |
note.toJSON() | NoteOptions | A nota como opções simples: id, x, y, width, height, content, color, surface e, quando houver, attachedElement. |
getNotes() / getNote(id) | Note[] / Note | undefined | As notas no gráfico. |
toJSON() é o que JSON.stringify chama, então salvar as notas é uma linha, e também desenhá-las em outro gráfico:
const saved = JSON.stringify(graph.getNotes())
other.setNotes(JSON.parse(saved))
// or one at a time
other.addNote(graph.getNote('n1').toJSON())Uma nota anexada a um nó mantém seu link quando o nó existe no outro grafo. Se as notas estão ocultas é uma configuração de visualização e fica fora de toJSON().
A classe Note também é exportada, como import { Note } from 'pivotick' ou Pivotick.Note na construção do navegador.