Para simplificar un diagrama de estados de Mermaid en Obsidian en un Mac, mantén explícitas todas las transiciones válidas, acorta las etiquetas y prueba la dirección de lectura. Compara el origen, el destino y el texto de cada transición antes de aceptar el resultado.

Esta guía usa cuatro estados sintéticos, A a D. La tarea consiste en facilitar la lectura de un diagrama y conservar sus transiciones directas, sus rutas de retorno y los marcadores de inicio y fin. La tabla de transiciones permite comprobar concretamente que se conserva la estructura, independientemente de cómo el renderizador sitúe las flechas.

¿Qué debe permanecer sin cambios al simplificar el diagrama?

Empieza por separar los cambios de presentación de los cambios al modelo. Acortar las etiquetas visibles y cambiar la dirección de lectura puede mejorar la legibilidad. Quitar una flecha cambia el conjunto de transiciones directas, aunque otra ruta siga llegando al mismo destino.

Por ejemplo, supón que existe tanto una transición directa de A a C como una ruta que pasa por B. Eliminar la transición directa obligaría al lector a inferir una visita intermedia a B. Se conserva la alcanzabilidad, pero se pierde una transición válida de un solo paso. Para esta tarea, no basta con llegar finalmente al mismo destino.

Usa el siguiente inventario de transiciones como especificación original. Las etiquetas son nombres de eventos sintéticos; tienen significado en este ejemplo y deben permanecer asociadas a sus flechas originales.

Origen Destino Texto de transición
Inicio A Ninguno
A B step
A C alternate
B C next
B A reset
C B back
C A reset
C D finish
D Fin Ninguno

Hay nueve transiciones, incluidas las de inicio y fin. Dos flechas comparten la etiqueta reset, pero parten de estados distintos. Conserva ambas. De igual forma, las flechas entre B y C tienen direcciones y etiquetas diferentes; son transiciones independientes.

Para un diagrama más grande, anota cada transición como una combinación de origen, destino y texto antes de editarlo. Si el texto original incluye condiciones o acciones, consérvalas también. Comparar solo el número total de flechas no permite detectar si cambió el destino o la etiqueta de alguna.

Comprueba qué renderizador usa tu versión instalada de Obsidian

En tu Mac, abre Settings desde el icono de engranaje de la barra lateral y selecciona General. Anota la versión actual de la aplicación y la del instalador que aparecen en la parte superior. Usa la versión de la aplicación al consultar las notas de la versión correspondiente. Estas ubicaciones se describen en la ayuda de Settings de Obsidian.

Es importante saber qué renderizador se usa. La versión de acceso anticipado de Obsidian 1.15.0 Desktop, con fecha del 22 de octubre de 2026, cambia el renderizado de diagramas a Pele e indica compatibilidad con la sintaxis de Mermaid 12.1.0. Sus notas de la versión también dicen que esta versión ya no incluye la biblioteca de Mermaid. Esa afirmación se aplica a la versión indicada; no identifica el renderizador de todas las versiones instaladas de Obsidian. Consulta las notas de la versión de Obsidian 1.15.0 Desktop.

Comprueba por separado la compatibilidad de la sintaxis y el aspecto visual. Un diagrama que otra aplicación acepte sirve como referencia, pero la aplicación instalada es donde debes verificar el resultado final. No des por sentado que un ajuste de diseño de un proyecto original o un ejemplo más reciente de la documentación funcionará igual en tu renderizador local.

El ejemplo siguiente evita deliberadamente la configuración del renderizador, los ajustes del tema y los estilos. Si ya tienes un diagrama funcional, empieza con su declaración actual y cambia un detalle de presentación a la vez. No hace falta actualizar la aplicación solo para hacer el inventario de transiciones y editar las etiquetas como se describe aquí.

Crea una versión compacta con transiciones explícitas

El ejemplo completo de abajo implementa las nueve filas del inventario. Los nombres visibles de los estados son intencionalmente cortos. El estado A es el punto de inicio; B y C tienen rutas de retorno, y solo D tiene una transición al marcador de fin.

Mermaid documenta los alias de estado, las transiciones etiquetadas, los marcadores de inicio y fin, y la declaración de dirección en su referencia de diagramas de estados. El método documentado por Obsidian para insertarlos consiste en usar un bloque de código cercado con el identificador de lenguaje mermaid, como se explica en Sintaxis avanzada de formato.

```mermaid
stateDiagram-v2
    direction LR

    state "Stage A" as A
    state "Stage B" as B
    state "Stage C" as C
    state "Stage D" as D

    [*] --> A

    A --> B : step
    A --> C : alternate

    B --> A : reset
    B --> C : next

    C --> A : reset
    C --> B : back
    C --> D : finish

    D --> [*]
```

Pega todo ese ejemplo de Markdown, incluidas las líneas de apertura y cierre con tres acentos graves, en una nota. El bloque externo con cuatro acentos graves que se muestra aquí solo sirve para presentar el ejemplo en este artículo; no forma parte del contenido de la nota.

Para inspeccionar el texto exacto, usa Source mode. Para ver el resultado renderizado, cambia a Reading view; en macOS, Cmd+E alterna entre las vistas de lectura y edición. Obsidian explica estos controles en Vistas y modo de edición.

Las instrucciones de transición se agrupan por estado de origen para poder revisar juntas las opciones de salida de cada estado. Esta organización facilita el mantenimiento del texto fuente, pero no garantiza dónde situará el renderizador cada estado.

Prueba el ejemplo con el ancho de nota que sueles usar. Después, elimina solo la línea direction LR y compara el resultado. Conserva la presentación que facilite seguir las bifurcaciones y las rutas de retorno. Un diagrama de izquierda a derecha puede necesitar más espacio horizontal, así que evalúa el resultado en el panel de nota que utilizas realmente.

Acorta las etiquetas solo hasta donde lo permita su significado. En este ejemplo sintético, Stage B no necesita más explicaciones. En tu propio diagrama, conserva cualquier palabra que permita distinguir dos estados. Si necesitas una explicación larga, ponla en un párrafo de prosa cercano y deja clara su correspondencia con el identificador del estado.

¿Qué atajos pueden cambiar el modelo?

La repetición de flechas puede tentar a introducir un nodo intermedio compartido. Antes de hacerlo, pregúntate qué representa ese nodo y si las transiciones directas originales siguen existiendo.

Un nodo de reinicio compartido cambia las rutas directas

En el inventario, B y C tienen cada uno una transición directa a A cuando se produce reset. Sustituir esas flechas por rutas que pasan por un estado nuevo llamado R crea un estado intermedio y elimina las conexiones directas originales. El lector aún puede seguir una ruta hasta A, pero el diagrama ahora describe pasos diferentes.

Para obtener exactamente el resultado de este artículo, conserva las dos flechas de reinicio. Su repetición representa dos condiciones iniciales válidas para el mismo evento. Reducir el espacio que ocupan visualmente solo resulta útil si su significado se mantiene.

Una elección o bifurcación necesita un motivo en el modelo

Mermaid documenta <<choice>> para bifurcar entre rutas y <<fork>> y <<join>> para estructuras de bifurcación y unión. Son construcciones distintas del diagrama, como se indica en la referencia de diagramas de estados.

No introduzcas una solo para reunir varias flechas desordenadas en una unión compartida. En este ejemplo, la tarea consiste en conservar las transiciones directas entre estados. Añadir una construcción intermedia exigiría explicar por separado cómo se corresponden sus rutas con el modelo original. Las flechas explícitas muestran esa correspondencia de inmediato.

Los estados compuestos tienen un límite documentado

Mermaid admite estados compuestos, pero su documentación prohíbe explícitamente las transiciones entre estados internos que pertenecen a estados compuestos diferentes. Consulta Estados compuestos.

Si al agrupar tus nodos se produce esa situación, para esta tarea deja los estados conectados en un nivel plano. Trasladar una flecha al estado compuesto externo cambia su extremo; no es automáticamente una sustitución equivalente. Usa una jerarquía cuando represente la estructura real del modelo y puedas explicar su comportamiento de entrada y salida.

En el ejemplo de cuatro estados, anidarlos aporta poco. La simplificación útil consiste en acortar las etiquetas y mejorar la presentación sin alterar la estructura de las transiciones.

Verifica las transiciones y el resultado renderizado

Haz dos revisiones antes de sustituir el diagrama original. La primera comprueba el modelo; la segunda, si la presentación elegida es útil.

  1. Compara cada fila del inventario con una instrucción de transición. Confirma ambos extremos y la etiqueta completa.
  2. Compara cada instrucción de transición con el inventario. Así detectarás flechas adicionales, además de las que falten.
  3. Comprueba por separado el inicio y el fin. En este caso, el inicio conduce únicamente a A, y solo D conduce al fin.
  4. Inspecciona el diagrama renderizado para comprobar que las etiquetas sean legibles y que se distingan las puntas de flecha.
  5. Sigue las rutas de retorno desde B y C, ya que es fácil pasarlas por alto si solo se revisa el avance hacia delante.

Para este ejemplo, prueba tres recorridos: del inicio a A, luego a C, después a D y finalmente al fin; del inicio a A, luego a B y después al reinicio en A; y del inicio a A, luego a C y de vuelta a B. Estos recorridos ponen a prueba la ruta alternativa, el reinicio y la conexión inversa. Complementan la comparación de filas, pero no la sustituyen.

Una comparación determinista de texto confirmó que las nueve instrucciones de transición del ejemplo coinciden con el inventario, incluidas sus etiquetas. Durante la preparación no se renderizó el ejemplo en una aplicación instalada de Obsidian, así que aún debes comprobar el espaciado y el trazado final de las flechas en tu versión local.

Si la nota muestra el código como texto literal, primero confirma que la estás viendo en Reading view y que el bloque de apertura indica mermaid. Si aparece un error de análisis después de editarlo, vuelve al ejemplo completo y aplica los cambios de uno en uno. Si solo resulta incómodo el diseño, conserva las transiciones y compara la longitud de las etiquetas, la dirección y el ancho disponible del panel.

Conserva la versión cuyas etiquetas y rutas sean más fáciles de leer, una vez aprobada la comparación con el inventario. Una simplificación satisfactoria permite seguir las mismas transiciones válidas con menos esfuerzo y mantiene un texto fuente fácil de inspeccionar y mantener.

Fuentes