Mapas mentales

La compatibilidad con mapas mentales de tablero es opcional. Agréguelo cuando su producto necesite nodos de mapas mentales e interacciones dentro del lienzo del tablero.

Registrar soporte para mapas mentales

import { UniverBoardsMindPlugin } from '@univerjs-pro/boards-mind'import { UniverBoardsMindUIPlugin } from '@univerjs-pro/boards-mind-ui'import BoardsMindUIEsES from '@univerjs-pro/boards-mind-ui/locale/es-ES'import '@univerjs-pro/boards-mind/facade'import '@univerjs-pro/boards-mind-ui/lib/index.css'univer.registerPlugin(UniverBoardsMindPlugin)univer.registerPlugin(UniverBoardsMindUIPlugin)

Compatibilidad móvil

Configure primero el editor móvil. En la inicialización en modo plugin de esta página, sustituya los registros de escritorio siguientes por las exportaciones móviles de los mismos paquetes antes de abrir un documento. Conserve modelos, estilos, traducciones e importaciones Facade; no registre ambas variantes.

Responsabilidades del paquete

• @univerjs-pro/boards-mind integra elementos de mapas mentales con el modelo de tablero.
• @univerjs-pro/boards-mind-ui agrega edición de mapas mentales, renderizado e interacción con la interfaz de usuario. También proporciona @univerjs-pro/boards-mind-ui/locale/* y @univerjs-pro/boards-mind-ui/lib/index.css para editores de navegador.

Opciones de tiempo de ejecución

Utilice ambos paquetes en un editor de navegador. Para el procesamiento de instantáneas del lado del servidor, registre el paquete del modelo con UniverBoardsPlugin y omita los paquetes de UI.

Registre la compatibilidad con mapas mentales antes de abrir instantáneas que contengan elementos de mapas mentales.

Facade API

Use la Facade estructurada en lugar de editar formas y conectores por separado.

const board = univerAPI.getActiveBoard()if (!board) throw new Error('No active Board')const mindMap = board.insertMindMap({  left: 180,  top: 180,  root: {    text: 'Release',    children: [      { text: 'Product', children: [{ text: 'Scope' }, { text: 'UX' }] },      { text: 'Engineering', children: [{ text: 'API' }, { text: 'QA' }] },      { text: 'Launch', children: [{ text: 'Docs' }] },    ],  },})if (!mindMap) throw new Error('Cannot insert mind map')const qa = mindMap.getNodes().find(node => node.getText() === 'QA')qa?.addChild({ text: 'Automation' })

FBoard ofrece insertMindMap, getMindMap y getMindMaps. El mapa permite buscar nodos y descendientes, gestionar disposición y límites, usar reflow, setLayout, setBranchLineType y eliminar. Los nodos admiten texto, inserción de hijos y hermanos, cambio de padre, promoción, separación, orden, estilos y plegado.

Redistribuir dentro de límites

reflow() distribuye y centra el mapa de forma atómica dentro de un rectángulo de coordenadas Board, conservando los tamaños de nodos y texto. Reintenta por defecto con los espacios mínimos admitidos. Si no cabe, deja Board intacto y devuelve bounds-too-small y requiredBounds.

const result = mindMap.reflow({  bounds: { left: 80, top: 80, width: 1_000, height: 600 },  padding: 24,})if (!result.success) {  console.warn(result.reason, result.requiredBounds)}

El rectángulo solo define la región de colocación: no cambia el padre, recorta ni redimensiona el contenedor. Una redistribución correcta se registra como una única acción de deshacer.