Cómo: Editar y personalizar documentos de gráfico

  • Artículo

En Visual Studio Ultimate, puede centrarse en las relaciones y áreas clave de una edición de gráfico dirigido editando los nodos y vínculos. Esto es especialmente útil cuando el gráfico muestra cantidades grandes de información. Por ejemplo, puede identificar los componentes principales de un sistema de software existente y las relaciones entre ellos. Puede compartir y analizar estas áreas de interés con los miembros del equipo. Para obtener información acerca de cómo se generan gráficos a partir del código, vea Cómo: Generar gráficos de dependencia para código .NET.

Para resaltar áreas de interés, puede seleccionar y filtrar nodos, aplicar estilos predefinidos a los nodos y vínculos y organizar los nodos en grupos. Puede personalizar aún más el gráfico editando el archivo Directed Graph Markup Language (DGML) del gráfico. Por ejemplo, puede modificar los elementos DGML del archivo para especificar estilos personalizados, asignar propiedades y categorías a nodos y vínculos, o vincular nodos a elementos, como documentos, direcciones URL y otros archivos .dgml. Para obtener más información sobre los elementos de DGML, vea Introducción a Directed Graph Markup Language (DGML).

Nota

Visual Studio limpia los atributos y elementos de DGML que no se usan, eliminándolos cuando se guarda el archivo .dgml. También crea automáticamente los elementos de nodo cuando se agregan los nuevos vínculos manualmente. Cuando se guarda el archivo .dgml, los atributos que agregara a un elemento se podrían reorganizar en orden alfabético.

Si desea modificar un gráfico, puede:

  • Seleccionar nodos

  • Ocultar o mostrar nodos

  • Ocultar o mostrar vínculos

  • Cambiar el estilo del gráfico

  • Cambiar el estilo de los nodos y vínculos

  • Copiar estilos de un gráfico a otro

  • Organizar nodos en grupos

  • Asignar propiedades a nodos y vínculos

  • Asignar categorías a nodos y vínculos

  • Vincular elementos a nodos

  • Crear alias para rutas de acceso usadas con frecuencia

Seleccionar nodos

Para

Siga estos pasos

Seleccionar nodos de categorías específicas

  1. Haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Mostrar selección avanzada.

  2. En el cuadro Selección, en Categorías, haga clic en las categorías que desee.

Para crear y asignar una categoría personalizada, vea Asignar categorías a nodos y vínculos.

Seleccionar nodos con propiedades o valores de propiedad específicos

  1. Haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Mostrar selección avanzada.

  2. En el cuadro Selección, en Propiedades, haga clic en las propiedades que desee. Para seleccionar valores de propiedad específicos, expanda la propiedad.

Agregar nodos relacionados a los nodos seleccionados

Haga clic con el botón secundario en los nodos seleccionados, haga clic en Selección y, a continuación, elija una de las opciones siguientes:

  • Para agregar nodos que establecen un vínculo directamente al nodo seleccionado, haga clic en Seleccionar entrantes.

  • Para agregar nodos que establecen un vínculo directamente desde el nodo seleccionado, haga clic en Seleccionar salientes.

  • Para agregar nodos que establecen un vínculo directamente al y desde el nodo seleccionado, haga clic en Seleccionar ambos.

  • Para agregar todos los nodos que establecen un vínculo cuyo origen y destino es el nodo seleccionado, haga clic en Seleccionar todos los nodos conectados.

  • Para agregar todos los elementos secundarios del nodo seleccionado, haga clic en Seleccionar secundarios.

Seleccionar todos los nodos no seleccionados

Haga clic con el botón secundario en los nodos seleccionados, elija Selección y, a continuación, haga clic en Invertir.

Ocultar o mostrar nodos

Al ocultar nodos del gráfico, dejan de aparecer en el gráfico y participar en ningún algoritmo de diseño.

Para

Siga estos pasos

Ocultar los nodos seleccionados

  1. Seleccione los nodos que desea ocultar.

  2. Haga clic con el botón secundario en los nodos seleccionados o en el gráfico, elija Selección y, a continuación, haga clic en Ocultar.

Ocultar nodos con determinadas categorías o propiedades

  1. Para mostrar el cuadro Selección, haga clic con el botón secundario en la superficie del gráfico y, a continuación, haga clic en Mostrar selección avanzada.

  2. En el cuadro Selección, haga clic en las categorías o propiedades que desee.

  3. Haga clic con el botón secundario en la superficie del gráfico, elija Selección y, a continuación, haga clic en Ocultar.

Ocultar nodos no seleccionados

  1. Seleccione los nodos que no desea ocultar.

  2. Haga clic con el botón secundario en los nodos seleccionados o en el gráfico, elija Selección y, a continuación, haga clic en Ocultar no seleccionados.

Mostrar todos los nodos ocultos

Haga clic con el botón secundario en el gráfico, elija Selección y, a continuación, haga clic en Mostrar todo.

Para ocultar nodos editando el archivo .dgml

  1. Haga clic con el botón secundario en la superficie del gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  2. En el elemento <Node/>, agregue el siguiente atributo para ocultar el nodo:

    Visibility="Hidden"

    Por ejemplo:

    <Nodes>
   <Node Id="MyNode" Visibility="Hidden"/>
</Nodes>

Ocultar o mostrar vínculos

Puede controlar el nivel de detalle de un gráfico especificando los tipos de vínculos que desea ver. En el gráfico se muestran dos tipos de vínculos: los vínculos directos entre nodos y los vínculos entre grupos, que de forma predeterminada están ocultos. Los vínculos entre grupos son todos los vínculos individuales que conectan nodos entre diferentes grupos.

Cuando se contraen los grupos, el gráfico agrega todos los vínculos entre grupos a los vínculos individuales que hay entre los grupos. Cuando se expanden los grupos, se pueden seleccionar los nodos que hay dentro de un grupo y aparecen los nuevos vínculos entre grupos, donde se muestran las dependencias reales que existen dentro de ese grupo.

Para mostrar u ocultar vínculos

  1. Si la barra de herramientas del gráfico no está visible, en el menú Ver, elija Barras de herramientas y, a continuación, haga clic en Gráfico dirigido.

  2. Seleccione una tarea en la tabla siguiente:

    Para

    Haga clic en

    Mostrar todos los vínculos entre grupos en todo momento

    Mostrar todos los vínculos entre grupos

    Mostrar solo los vínculos entre grupos que están conectados a los nodos seleccionados

    Mostrar los vínculos entre grupos de los nodos seleccionados

    Ocultar todos los vínculos entre grupos en todo momento

    Ocultar todos los vínculos entre grupos

    Ocultar todos los vínculos (o mostrar todos los vínculos)

    Ocultar todos los vínculos

    Para mostrar todos los vínculos, haga clic de nuevo en Ocultar todos los vínculos para desactivar este modo.

Cambiar el estilo del gráfico

Puede cambiar el color de fondo y el color del borde del gráfico editando el archivo .dgml del gráfico. Para cambiar el estilo de los nodos y los vínculos, vea Cambiar el estilo de los nodos y vínculos.

Para cambiar el estilo del gráfico

  1. Haga clic con el botón secundario en la superficie del gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  2. En el elemento <DirectedGraph>, agregue cualquiera de los siguientes atributos para cambiar el estilo:

    Para cambiar el

    Agregue el atributo siguiente

    Color de fondo

    		 
    Background="ColorNameOrHexadecimalValue"

    Color del borde

    		 
    Stroke="StrokeValue"

    Por ejemplo:

    <DirectedGraph Background="Green" xmlns="https://schemas.microsoft.com/vs/2009/dgml" >
   ...
   ...
</DirectedGraph>

Cambiar el estilo de los nodos y vínculos

Puede cambiar los iconos de los nodos y los colores de los nodos y los vínculos. Puede usar colores e iconos predefinidos o especificar unos personalizados editando el archivo .dgml del gráfico. Para obtener más información, vea Aplicar estilos personalizados a nodos y vínculos.

Por ejemplo, puede elegir un color para resaltar los nodos y los vínculos que tengan cierta categoría o propiedad. De este modo, podrá identificar áreas específicas del gráfico y concentrarse en ellas.

Para aplicar un color o icono predefinido a los nodos cierta categoría o propiedad

  1. Si el cuadro Leyenda no está visible, haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Mostrar leyenda.

  2. En el cuadro Leyenda, vea si la categoría o propiedad del nodo aparece en la lista.

  3. Si la lista no incluye la categoría o propiedad, haga clic en Agregar, elija Categoría de nodo o Propiedad de nodo y, a continuación, seleccione la categoría o propiedad.

    Nota

    Para crear y asignar una categoría a un nodo, vea Asignar categorías a nodos y vínculos. Crear y asignar una propiedad a un nodo, vea Asignar propiedades a nodos y vínculos.

  4. En el cuadro Leyenda, haga clic en la lista desplegable situada junto a la categoría o propiedad.

  5. Use la tabla siguiente para seleccionar el estilo que desea cambiar:

    Para cambiar el

    Select

    Color de fondo

    Background

    Color del contorno

    Trazo

    Color del texto

    Foreground

    Icono

    Iconos

  6. En el cuadro de diálogo de selección, elija una de las opciones siguientes:

    Para aplicar a

    Siga estos pasos

    Conjunto de colores (o iconos)

    Haga clic en la lista desplegable Seleccionar conjunto de colores (iconos) y, a continuación, haga clic en un conjunto de colores (o iconos).

    Para revertir el color (o icono) predeterminado, en la lista desplegable Seleccionar conjunto de colores (iconos), haga clic en Ninguno.

    Color (o icono) específico

    Haga clic en la lista desplegable del valor de propiedad o categoría y, a continuación, seleccione un color (o icono).

  7. Cuando termine, haga clic en Aceptar.

    Nota

    Puede reorganizar, eliminar o desactivar temporalmente los estilos en el cuadro Leyenda. Para obtener más información, vea Modificar el cuadro Leyenda.

Para aplicar un color predefinido a los vínculos con una determinada categoría o propiedad

  1. Si el cuadro Leyenda no está visible, haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Mostrar leyenda.

  2. En el cuadro Leyenda, observe si la categoría o propiedad aparece en la lista.

  3. Si la lista no incluye la categoría o propiedad, haga clic en Agregar, elija Categoría de vínculo o Propiedad de vínculo y, a continuación, seleccione la categoría o propiedad.

    Nota

    Para crear y asignar una categoría a un vínculo, vea Asignar categorías a nodos y vínculos. Para crear y asignar una propiedad a un vínculo, vea Asignar propiedades a nodos y vínculos.

  4. En el cuadro Leyenda, haga clic en la lista desplegable situada junto a la categoría o propiedad.

  5. Use la tabla siguiente para seleccionar el estilo que desea cambiar:

    Para cambiar el

    Select

    Color de la punta de flecha

    Background

    Color del contorno

    Trazo

  6. En el cuadro Selector de conjunto de colores, elija una de las opciones siguientes:

    Para aplicar a

    Siga estos pasos

    Conjunto de colores

    Haga clic en la lista desplegable Seleccionar conjunto de colores y, a continuación, haga clic en un conjunto de colores.

    Para volver al color predeterminado, en la lista desplegable Seleccionar conjunto de colores, haga clic en Ninguno.

    Color específico

    Haga clic en la lista desplegable del tipo o valor de propiedad para seleccionar un color.

  7. Cuando termine, haga clic en Aceptar.

    Nota

    Puede reorganizar, eliminar o desactivar temporalmente los estilos en el cuadro Leyenda. Para obtener más información, vea Modificar el cuadro Leyenda.

Aplicar estilos personalizados a nodos y vínculos

Puede aplicar estilos personalizados a los siguientes elementos:

  • Nodos y vínculos únicos

  • Grupos de nodos y vínculos

  • Grupos de nodos y vínculos de acuerdo con ciertas condiciones

Para aplicar un estilo personalizado a un único nodo

  1. Haga clic con el botón secundario en el nodo cuyo estilo desea personalizar y, a continuación, hace clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico y resalta el elemento <Node/> de ese nodo.

  2. En el elemento <Node/>, agregue cualquiera de los siguientes atributos para personalizar el estilo:

    Para cambiar el

    Agregue el atributo siguiente

    Color de fondo

    		 
    Background="ColorNameOrHexadecimalValue"

    Contorno

    		 
    Stroke="ColorNameOrHexadecimalValue"

    Grosor del contorno

    		 
    StrokeThickness="StrokeValue"

    Color del texto

    		 
    Foreground="ColorNameOrHexadecimalValue"

    Icono

    		 
    Icon="IconFilePathLocation"

    Tamaño del texto

    		 
    FontSize="FontSizeValue"

    Tipo de texto

    		 
    FontFamily="FontFamilyName"

    Grosor del texto

    		 
    FontWeight="FontWeightValue"

    Estilo del texto

    		 
    FontStyle="FontStyleName"

    Por ejemplo, puede especificar Italic como estilo de texto.

    Textura

    		 
    Style="Glass"

    O bien

    Style="Plain"

    Forma

    		 
    Shape

    Por ejemplo:

    <Nodes>
   <Node Id="MyNode" Background="Green" Stroke="#FF000000"
   Foreground="White" Icon="...\Graph Icons\MyNodeIcon.jpg"/>
</Nodes>

Para aplicar un estilo personalizado a un único vínculo

  1. En el gráfico, mueva el puntero del mouse sobre el vínculo para mostrar la información sobre herramientas e identificar el nodo de origen y el nodo de destino del vínculo.

  2. Haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  3. Busque el elemento <Link/> que contiene el nombre del nodo de origen y el nombre del nodo de destino.

  4. En el elemento <Link/>, agregue cualquiera de los siguientes atributos para personalizar el estilo:

    Para cambiar el

    Agregue el atributo siguiente

    Color de la punta de flecha

    		 
    Background="ColorNameOrHexadecimalValue"

    Color del contorno

    		 
    Stroke="ColorNameOrHexadecimalValue"

    Grosor del contorno

    		 
    StrokeThickness="StrokeValue"

    Estilo del contorno

    		 
    StrokeDashArray="StrokeArrayValues"

    Por ejemplo:

    <Links>
   <Link Source="MyFirstNode" Target="MySecondNode" Background="Green" Stroke="#FF000000" />
</Links>

Para aplicar estilos personalizados a un grupo de nodos o vínculos

  1. Asigne cualquier categoría o propiedad que desee a los nodos o vínculos.

    Para obtener más información, vea Asignar categorías a nodos y vínculos y Asignar propiedades a nodos y vínculos.

  2. Haga clic con el botón secundario en la superficie del gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  3. Si no existe ningún elemento <Styles></Styles>, agregue uno bajo el elemento <DirectedGraph></DirectedGraph>, detrás del elemento <Links></Links>.

  4. En el elemento <Styles></Styles>, bajo el elemento <Style/>, especifique los atributos siguientes:

    • TargetType="Node | Link | Graph"

    • GroupLabel="NameInLegendBox"

    • ValueLabel="NameInStylePickerBox"

    Para aplicar un estilo personalizado a todos los tipos de destino, no use ninguna condición.

Para aplicar un estilo condicional a los grupos de nodos o vínculos

  1. En el elemento <Style/>, agregue un elemento <Condition/> que contenga un atributo Expression para especificar una expresión que devuelva un valor booleano.

    Por ejemplo:

    <Condition Expression="MyCategory"/>

    – O bien –

    <Condition Expression="MyCategory > 100"/>

    O bien

    <Condition Expression="HasCategory('MyCategory')"/>

    Esta expresión usa la sintaxis de la forma de Backus-Naur (BNF) siguiente:

    <Expression> ::= <BinaryExpression> | <UnaryExpression> | "("<Expression>")" | <MemberBindings> | <Literal> | <Number>

    <BinaryExpression> ::= <Expression> <Operator> <Expression>

    <UnaryExpression> ::= "!" <Expression> | "+" <Expression> | "-" <Expression>

    <Operator> ::= "<" | "<=" | "=" | ">=" | ">" | "!=" | "or" | "and" | "+" | "*" | "/" | "-"

    <MemberBindings> ::= <MemberBindings> | <MemberBinding> "." <MemberBinding>

    <MemberBinding> ::= <MethodCall> | <PropertyGet>

    <MethodCall> ::= <Identifier> "(" <MethodArgs> ")"

    <PropertyGet> ::= Identifier

    <MethodArgs> ::= <Expression> | <Expression> "," <MethodArgs> | <empty>

    <Identifier> ::= [^. ]*

    <Literal> ::= literal de cadena entre comillas simples o dobles

    <Number> ::= cadena de dígitos con separador decimal opcional

    Puede especificar varios elementos <Condition/> que deben ser True para aplicar el estilo.

  2. En la línea que sigue al elemento <Condition/>, agregue uno o varios elementos <Setter/> para especificar un atributo Property y un atributo Value fijo o un atributo Expression calculado para aplicarlo al gráfico, los nodos o los vínculos que satisfacen la condición.

    Por ejemplo:

    <Setter Property="BackGround" Value="Green"/>

En este sencillo ejemplo completo que se muestra a continuación, la condición especifica que un nodo debe aparecer en verde o en rojo en función de si su categoría Passed está establecida en True o False:

<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node Id="MyFirstNode" Passed="True" />
      <Node Id="MySecondNode" Passed="False" />
   </Nodes>
   <Links>
   </Links>
   <Styles>
      <Style TargetType="Node" GroupLabel="Passed" ValueLabel="True">
         <Condition Expression="Passed='True'"/>
         <Setter Property="Background" Value="Green"/>
      </Style>
      <Style TargetType="Node" GroupLabel="Passed" ValueLabel="False">
         <Condition Expression="Passed='False'"/>
         <Setter Property="Background" Value="Red"/>
      </Style>
   </Styles>
</DirectedGraph>

En la tabla siguiente se incluyen algunas condiciones de ejemplo que puede usar:

Para

DGML de ejemplo

Establecer el tamaño de fuente como una función del número de líneas de código, lo que también modificará el tamaño del nodo. En este ejemplo se usa una única expresión condicional para establecer varias propiedades: FontSize y FontFamily.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph xmlns="https://schemas.microsoft.com/vs/2009/dgml">
<Nodes>
   <Node Id="Class1" LinesOfCode ="200" />
   <Node Id="Class2" LinesOfCode ="1000" />
   <Node Id="Class3" LinesOfCode ="20" />
</Nodes>
<Properties>
   <Property Id="LinesOfCode" Label="LinesOfCode" Description="LinesOfCode" DataType="System.Int32" />
</Properties>
<Styles>
   <Style TargetType="Node" GroupLabel="LinesOfCode" ValueLabel="Function">
      <Condition Expression="LinesOfCode &gt; 0" />
      <Setter Property="FontSize" Expression="Math.Max(9,Math.Sqrt(LinesOfCode))" />
      <Setter Property="FontFamily" Value="Papyrus" />
   </Style>
</Styles>
</DirectedGraph>

Establecer el color de fondo de un nodo en función de la propiedad Coverage. Los estilos se evalúan en el orden en que aparecen, al igual que en las instrucciones if-else.

En este ejemplo:

  1. Si Coverage es menor que 80, la propiedad Background se establece en verde.

  2. En cambio, si Coverage es menor que 50, la propiedad Background se establece en una sombra naranja en función del valor de la propiedad Coverage.

  3. Por otro lado, la propiedad Background se establece en una sombra roja en función de la propiedad Coverage.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph xmlns="https://schemas.microsoft.com/vs/2009/dgml">
<Nodes>
   <Node Id="Class1" Coverage="58" />
   <Node Id="Class2" Coverage="95" />
   <Node Id="Class3" Coverage="32" />
</Nodes>
<Properties>
   <Property Id="Coverage" Label="Coverage" Description="Code coverage as a percentage of blocks" DataType="Double" />
</Properties>
<Styles>
   <Style TargetType="Node" GroupLabel="Coverage" ValueLabel="Good">
      <Condition Expression="Coverage &gt; 80" />
      <Setter Property="Background" Value="Green" />
   </Style>
   <Style TargetType="Node" GroupLabel="Coverage" ValueLabel="OK">
      <Condition Expression="Coverage &gt; 50" />
      <Setter Property="Background" Expression="Color.FromRgb(180 * Math.Max(1, (80 - Coverage) / 30), 180, 0)" />
   </Style>
   <Style TargetType="Node" GroupLabel="Coverage" ValueLabel="Bad">
      <Setter Property="Background" Expression="Color.FromRgb(180, 180 * Coverage / 50, 0)" />
   </Style>
</Styles>
</DirectedGraph>

Establecer la propiedad Shape en None para que el icono reemplace a la sombra. Use la propiedad Icon para especificar la ubicación del icono.

 
<DirectedGraph xmlns="https://schemas.microsoft.com/vs/2009/dgml">
<Nodes>
   <Node Id="Automation" Category="Test" Label="Automation" />
   <Node Id="C# Provider" Category="Provider" Label="C# Provider" />
</Nodes>
<Categories>
   <Category Id="Provider" Icon="..\Icons\AddIn.png" Shape="None" />
   <Category Id="Test" Icon="..\Icons\Macro.png" Shape="None" />
</Categories>
<Properties>
   <Property Id="Icon" DataType="System.String" />
   <Property Id="Label" Label="Label" Description="Displayable label of an Annotatable object" DataType="System.String" />
   <Property Id="Shape" DataType="System.String" />
</Properties>
<Styles>
   <Style TargetType="Node" GroupLabel="Group" ValueLabel="Has category">
      <Condition Expression="HasCategory('Group')" />
      <Setter Property="Background" Value="#80008080" />
   </Style>
   <Style TargetType="Node">
      <Setter Property="HorizontalAlignment" Value="Center" />
   </Style>
</Styles>
</DirectedGraph>

Modificar el cuadro Leyenda

Puede reorganizar, eliminar o desactivar temporalmente los estilos en el cuadro Leyenda:

  1. Haga clic con el botón secundario en un estilo del cuadro Leyenda.

  2. Realice una de las tareas siguientes:

    Para

    Haga clic en

    Subir el estilo

    Subir

    Bajar el elemento

    Bajar

    Eliminar el elemento

    Eliminar

    Desactivar el elemento

    Deshabilitar

    Reactivar el elemento

    Habilitar

Copiar estilos de un gráfico a otro

  • Haga clic con el botón secundario en un área en blanco del gráfico de origen, haga clic en Copiar leyenda y, a continuación, pegue el estilo en el gráfico de destino.

Organizar nodos en grupos

Para

Siga estos pasos

Mostrar los nodos con relaciones de contención como grupos o vínculos

Para mostrar los vínculos como grupos, seleccione los nodos contenedores, haga clic con el botón secundario en la selección, elija Grupo y, a continuación, haga clic en Mostrar como grupo.

Para mostrar los grupos como vínculos, seleccione los nodos contenedores, haga clic con el botón secundario en la selección, elija Grupo y, a continuación, haga clic en Mostrar como grupo.

Para mostrar todos los grupos como vínculos, haga clic con el botón secundario en el gráfico, elija Grupo y, a continuación, haga clic en Mostrar todo como vínculos.

Para mostrar todos los vínculos como grupos, haga clic con el botón secundario en el gráfico, elija Grupo y, a continuación, haga clic en Mostrar todo como grupos.

Agregar un nuevo grupo que incluya los nodos seleccionados

  1. Haga clic con el botón secundario en la selección, elija Grupo y, a continuación, haga clic en Agregar grupo primario.

  2. Haga clic con el botón secundario en el nuevo grupo y, a continuación, haga clic en Propiedades.

  3. En la propiedad Label, cambie el nombre del grupo.

Agregar un nuevo grupo que incluya los nodos que tienen categorías o propiedades específicas

  1. Para mostrar el cuadro Selección, haga clic con el botón secundario en la superficie del gráfico y, a continuación, haga clic en Mostrar selección avanzada

  2. En el cuadro Selección, haga clic en las categorías o propiedades que desee.

  3. Haga clic con el botón secundario en la superficie del gráfico, elija Grupo y, a continuación, haga clic en Agregar grupo primario.

  4. Haga clic con el botón secundario en el nuevo grupo y, a continuación, haga clic en Propiedades.

  5. En la propiedad Label, cambie el nombre del grupo.

Agrupar nodos con arreglo a sus contenedores

  1. En el menú Arquitectura, elija Windows y, a continuación, haga clic en Explorador de arquitectura.

  2. Use el Explorador de arquitectura para buscar y seleccionar todos los nodos que desea agrupar.

    Para obtener más información, vea Cómo: Buscar código mediante el explorador de arquitectura.

  3. En el lado derecho de la columna actual, haga clic en la columna de acción contraída para expandirla.

    NotaNota
    La columna de acción aparece resaltada cuando el puntero se desplaza sobre ella.

  4. En la columna de acción, haga clic en Contenido por.

  5. En la columna siguiente, arrastre los grupos contenedores al gráfico.

  6. Haga clic con el botón secundario en la superficie del gráfico, elija Grupo y, a continuación, haga clic en Mostrar todo como grupos.

Agrupar nodos con arreglo a sus valores de propiedad

  1. Guarde el gráfico en el disco como un archivo .dgml.

  2. En el menú Arquitectura, elija Windows y, a continuación, haga clic en Explorador de arquitectura.

  3. En el Explorador de arquitectura, en Sistema de archivos, haga clic en Seleccionar archivos.

  4. En la columna siguiente, haga clic en el archivo .dgml guardado.

  5. Use el Explorador de arquitectura para buscar y seleccionar todos los nodos que desea agrupar.

    Para obtener más información, vea Cómo: Buscar código mediante el explorador de arquitectura.

  6. En el lado derecho de la columna actual, haga clic en la columna de acción contraída para expandirla.

    NotaNota
    La columna de acción aparece resaltada cuando se desplaza el puntero sobre ella.

  7. En la columna de acción, en Agrupar, haga clic en Agrupar por propiedades.

  8. En la columna siguiente, seleccione las propiedades que desea usar como grupos.

    Aparece la columna siguiente y en ella se muestran los valores de propiedad disponibles.

  9. En la columna siguiente, arrastre los grupos de valores de propiedad al gráfico.

  10. Haga clic con el botón secundario en la superficie del gráfico, elija Grupo y, a continuación, haga clic en Mostrar todo como grupos.

Quitar grupos

Seleccione el grupo o grupos que desea quitar, haga clic con el botón secundario en la selección, elija Grupo y, a continuación, haga clic en Quitar grupo.

Quitar nodos desde el grupo primario hasta el grupo primario principal o fuera del grupo si no hay ningún grupo primario principal

Seleccione los nodos que desea mover, haga clic con el botón secundario en la selección, elija Grupo y, a continuación, haga clic en Quitar del elemento primario.

También puede organizar los nodos en grupos editando el archivo .dgml del gráfico.

Para usar un nodo existente como grupo o agregar un nuevo grupo

  1. Para usar un nodo existente como grupo, haga clic con el botón secundario en el nodo que desea usar como nodo de grupo y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico y resalta el elemento <Node/> de ese nodo.

    O bien

    1. Para agregar un nuevo grupo, haga clic con el botón secundario en un área en blanco del gráfico y, a continuación, haga clic en Ver DGML.

    2. En la sección <Node/>, agregue un nuevo elemento <Nodes>.

  2. En el elemento <Node/>, agregue un atributo Group para especificar si el grupo aparece contraído o expandido. Por ejemplo:

    <Nodes>
   <Node Id="MyFirstGroup" Group="Expanded" />
   <Node Id="MySecondGroup" Group="Collapsed" />
</Nodes>

  3. En la sección <Links>, asegúrese de que existe un elemento <Link/> con los atributos siguientes para cada relación entre un nodo de grupo y sus nodos secundarios:

    • Un atributo Source que especifica el nodo de grupo

    • Un atributo Target que especifica el nodo secundario

    • Un atributo Category que especifica una relación Contains entre el nodo de grupo y su nodo secundario

    Por ejemplo:

    <Links>
   <Link Category="Contains" Source="MyFirstNewGroup" Target="FirstGroupChildOne" />
   <Link Category ="Contains" Source="MyFirstNewGroup" Target="FirstGroupChildTwo" />
   <Link Category ="Contains" Source="MySecondNewGroup" Target="SecondGroupChildOne" />
   <Link Category="Contains" Source="MySecondNewGroup" Target="SecondGroupChildTwo" />
</Links>

    Para obtener más información sobre el atributo Category, vea Asignar categorías a nodos y vínculos.

Asignar propiedades a nodos y vínculos

Puede organizar los nodos y vínculos asignándoles propiedades. Por ejemplo, puede seleccionar nodos que tengan propiedades concretas para que pueda agruparlos, cambiar su estilo u ocultarlos.

Para asignar una propiedad a un nodo

  1. Haga clic con el botón secundario en el nodo y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico y resalta el elemento <Node/> de ese nodo.

  2. En el elemento <Node/>, especifique el nombre de la propiedad y su valor. Por ejemplo:

    <Nodes>
   <Node Id="MyNode" MyPropertyName="PropertyValue" />
</Nodes>

  3. Agregue un elemento <Property/> a la sección <Properties> para especificar atributos, como el nombre visible y el tipo de datos:

    <Properties>
   <Property Id="MyPropertyName" Label="My Property" DataType="System.DataType"/>
</Properties>

Para asignar una propiedad a un vínculo

  1. En el gráfico, mueva el puntero del mouse sobre el vínculo para mostrar la información sobre herramientas e identificar el nodo de origen y el nodo de destino del vínculo.

  2. Haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  3. Busque el elemento <Link/> que contiene el nombre del nodo de origen y el nombre del nodo de destino.

  4. En el elemento <Node/>, especifique el nombre de la propiedad y su valor. Por ejemplo:

    <Links>
   <Link Source="MyFirstNode" Target="MySecondNode" MyPropertyName="PropertyValue" />
</Links>

  5. Agregue un elemento <Property/> a la sección <Properties> para especificar atributos, como el nombre visible y el tipo de datos:

    <Properties>
   <Property Id="MyPropertyName" Label="My Property Name" DataType="System.DataType"/>
</Properties>

Asignar categorías a nodos y vínculos

Puede organizar los nodos asignándoles categorías. Por ejemplo, puede seleccionar nodos que pertenezcan a determinadas categorías para que pueda agruparlos, cambiar su estilo u ocultarlos. Puede resaltar los vínculos que tengan ciertas categorías. Para obtener más información, vea las secciones siguientes:

  • Organizar nodos en grupos

  • Cambiar el estilo de los nodos y vínculos

  • Ocultar o mostrar nodos

Para asignar una categoría a un nodo

  • Para asignar una categoría predefinida, como Categoría 1, haga clic con el botón secundario en el nodo, elija Clasificar y, a continuación, haga clic en una categoría predefinida.

– O bien –

  • Para crear y asignar una categoría personalizada:

    • Haga clic en el nodo que desea clasificar, presione F4 para abrir la ventana Propiedades, escriba el nombre de la categoría en la propiedad New Category del nodo y, a continuación, presione ENTRAR.

    – O bien –

    1. Haga clic con el botón secundario en el nodo y, a continuación, haga clic en Ver DGML.

      Visual Studio abre el archivo .dgml del gráfico y resalta el elemento <Node/> de ese nodo.

    2. En el elemento <Node/>, agregue un atributo Category para especificar el nombre de la categoría. Por ejemplo:

      <Nodes>
   <Node Id="MyNode" Category="MyCategory" />
</Nodes>

    3. Agregue un elemento <Category/> a la sección <Categories> de modo que pueda usar el atributo Label con el fin de especificar el texto visualizado de esa categoría:

      <Categories>
   <Category Id="MyCategory" Label="My Category" />
</Categories>

Para asignar una categoría a un vínculo

  1. En el gráfico, mueva el puntero del mouse sobre el vínculo para mostrar la información sobre herramientas e identificar el nodo de origen y el nodo de destino del vínculo.

  2. Haga clic con el botón secundario en el gráfico y, a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico.

  3. Busque el elemento <Link/> que contiene el nombre del nodo de origen y el nombre del nodo de destino.

  4. En el elemento <Link/>, agregue un atributo Category para especificar el nombre de la categoría. Por ejemplo:

    <Links>
   <Link Source="MyFirstNode" Target="MySecondNode" Category="MyCategory"
</Links>

  5. Agregue un elemento <Category/> a la sección <Categories> de modo que pueda usar el atributo Label con el fin de especificar el texto visualizado de esa categoría:

    <Categories>
   <Category Id="MyCategory" Label="My Category" />
</Categories>

Puede crear categorías jerárquicas que le ayuden a organizar los nodos y a agregar atributos a categorías secundarias usando la relación de herencia.

Para crear categorías jerárquicas

  • Agregue un elemento <Category/> de la categoría primaria y, a continuación, agregue el atributo BasedOn al elemento <Category/> de la categoría secundaria.

    Por ejemplo:

    <Nodes>
   <Node Id="MyFirstNode" Label="My First Node" Category= "MyCategory" />
   <Node Id="MySecondNode" Label="My Second Node" />
</Nodes>
<Links>
   <Link Source="MyFirstNode" Target="MySecondNode" />
</Links>
<Categories>
   <Category Id="MyCategory" Label="My Category" BasedOn="MyParentCategory"/>
   <Category Id="MyParentCategory" Label="My Parent Category" Background="Green"/>
</Categories>

    En este ejemplo, el fondo de MyFirstNode es verde porque su atributo Category hereda el atributo Background de MyParentCategory.

Vincular elementos a nodos

Puede vincular elementos, como documentos o direcciones URL, a un nodo modificando el archivo .dgml del gráfico y agregando un atributo Reference al elemento <Node/> de ese nodo. El atributo Reference especifica la ruta de acceso del contenido. Puede tratarse de una ruta de acceso absoluta o de una ruta de acceso relativa a la ubicación del archivo .dgml. Puede abrir y ver ese contenido en el gráfico o en el nodo.

Nota

El elemento o elementos a los que se hace referencia deben existir para poder verse

Por ejemplo, quizá desee vincular los elementos siguientes:

  • Para describir los cambios de una clase, puede vincular la dirección URL de un elemento de trabajo, documento u otro archivo .dgml al nodo de una clase.

  • Podría vincular un diagrama de capas a un nodo de grupos que representa una capa en la arquitectura lógica del software.

  • Para mostrar más información sobre un componente que expone una interfaz, puede vincular un diagrama de componentes al nodo de esa interfaz.

  • Vincule un nodo a un elemento de trabajo o error de Team Foundation Server o a cualquier otra información relacionada con el nodo.

Para vincular un elemento a un nodo

  1. En el gráfico, haga clic con el botón secundario en el nodo y a continuación, haga clic en Ver DGML.

    Visual Studio abre el archivo .dgml del gráfico y resalta el elemento <Node/> de ese nodo.

  2. Realice una de las tareas de la tabla siguiente:

    Para vincular

    Siga estos pasos

    Un elemento único

    • En el elemento <Node/>, agregue un atributo Reference para especificar la ubicación del elemento.

      NotaNota
      Solo puede tener un atributo Reference por cada elemento <Node/>.

    Por ejemplo:

    <Nodes>
   <Node Id="MyNode" Reference="MyDocument.txt" />
</Nodes>
<Properties>
   <Property Id="Reference" Label="My Document" DataType="System.String" IsReference="True" />
</Properties>

    Varios elementos

    1. En el elemento <Node/>, agregue un nuevo atributo para especificar la ubicación de cada referencia.

    2. En la sección <Properties>:

      1. Agregue un elemento <Property/> para cada nuevo tipo de referencia.

      2. Establezca al atributo Id en el nombre del nuevo atributo de referencia.

      3. Agregue el atributo IsReference y establézcalo en True para hacer que la referencia aparezca en el menú contextual Ir a del nodo.

      4. Use el atributo Label para especificar el texto visualizado del menú contextual Ir a del nodo.

    Por ejemplo:

    <Nodes>
   <Node Id="MyNode" SequenceDiagram="MySequenceDiagram.sequencediagram" ActiveBugs="MyActiveBugs.wiq"/>
</Nodes>
<Properties>
   <Property Id="SequenceDiagram" Label="My Sequence Diagram" DataType="System.String" IsReference="True" />
   <Property Id="ActiveBugs" Label="Active Bugs" DataType="System.String" IsReference="True" />
</Properties>

    En el gráfico, el nombre del nodo aparece subrayado.

  3. Use el atributo ReferenceTemplate para especificar una cadena común, como una dirección URL, que se use en varias referencias en lugar de repetir esa cadena en la referencia.

    El atributo ReferenceTemplate especifica un marcador de posición para el valor de la referencia. En el ejemplo siguiente, el marcador de posición {0} del atributo ReferenceTemplate se reemplazará por los valores de los atributos MyFirstReference y MySecondReference del elemento <Node/> para generar una ruta de acceso completa:

    <Nodes>
   <Node Id="MyNode" MyFirstReference="MyFirstDocument" MySecondReference="MySecondDocument"/>
   <Node Id="MySecondNode" MyFirstReference="AnotherFirstDocument" MySecondReference="AnotherSecondDocument"/>
</Nodes>
<Properties>
   <Property Id="MyFirstReference" Label="My First Document" DataType="System.String" IsReference="True" ReferenceTemplate="http://www.Fabrikam.com/FirstDocuments/{0}.asp"/>
   <Property Id="MySecondReference" Label="My Second Document" DataType="System.String" IsReference="True" ReferenceTemplate=" http://www.Fabrikam.com/SecondDocuments/{0}.asp"/>
</Properties>

  4. Realice una de las siguientes tareas para ver el elemento al que se hace referencia:

    Para ver

    Realice el paso siguiente

    Un elemento único

    Haga doble clic en el nodo.

    O bien

    Haga clic con el botón secundario en el nodo, elija Ir a y, a continuación, haga clic en el elemento.

    Varios elementos

    Haga clic con el botón secundario en el nodo, elija Ir a y, a continuación, haga clic en un elemento.

Crear alias para rutas de acceso usadas con frecuencia

El reemplazo de rutas de acceso usadas con frecuencia con alias ayuda a reducir el tamaño del archivo .dgml y el tiempo necesario para cargar o guardar el archivo. Para crear un alias, agregue una sección <Paths></Paths> al final del archivo .dgml. En esta sección, agregue un elemento <Path/> para definir un alias para la ruta de acceso:

<Paths>
   <Path Id="MyPathAlias" Value="C:\...\..." />
</Paths>

Para hacer referencia al alias desde un elemento del archivo .dgml, rodee el valor Id del elemento <Path/> con un signo de dólar ($) y paréntesis (()):

<Nodes>
   <Node Id="MyNode" Reference="$(MyPathAlias)MyDocument.txt" />
</Nodes>
<Properties>
   <Property Id="Reference" Label="My Document" DataType="System.String" IsReference="True" />
</Properties>

Introducción a Directed Graph Markup Language (DGML)

DGML usa XML simple para describir los gráficos dirigidos cíclicos y acíclicos. Un gráfico dirigido es un conjunto de nodos que están conectados mediante vínculos, o bordes. Se pueden usar nodos y vínculos para representar estructuras de red, como elementos en un proyecto de software. Use DGML para visualizar información, realizar análisis de complejidad o simplemente examinar y editar gráficos dirigidos.

Los nodos y vínculos se llaman elementos de gráfico o solo elementos. En la tabla siguiente se describen los tipos de elementos que se emplean en DML:

Nota

Al editar un archivo .dgml, IntelliSense le ayuda a identificar los atributos disponibles para cada elemento y sus valores. Para especificar color en un atributo, use nombres para los colores comunes, como "Blue", o valores hexadecimales de ARGB, como "#ffa0b1c3". DGML emplea un pequeño subconjunto de los formatos de definición de color de Windows Presentation Foundation (WPF). Para obtener más información, vea Colors Class.

Elemento

Formato de ejemplo

<DirectedGraph></DirectedGraph>

Este elemento es el elemento raíz de un documento de gráfico dirigido (.dgml). Todos los demás elementos de DGML aparecen dentro del ámbito de este elemento.

En la lista siguiente se describen atributos opcionales que puede incluir:

  • Background: color del fondo del gráfico

  • BackgroundImage: ubicación de un archivo de imagen que se va a usar como fondo del gráfico.

  • ButterflyMode: si es True, muestra únicamente los nodos vinculados que están en la misma ruta de acceso que los nodos seleccionados. Si no hay ningún nodo seleccionado, el gráfico selecciona el concentrador primario.

    NotaNota
    Los vínculos circulares no se muestran en este modo.En cambio, se copian los nodos que participan en relaciones circulares para que aparezcan a ambos lados de los nodos seleccionados.Las dependencias que tienen varios niveles aparte del nodo seleccionado, no aparecerán necesariamente en orden porque el diseño del gráfico se basa en la ruta de acceso más corta del nodo seleccionado.

    Para obtener más información, vea Cómo: Navegar y examinar los documentos de gráfico.

  • GraphDirection: cuando el gráfico está establecido en el diseño de árbol (Sugiyama), organiza los nodos para que la mayoría de los vínculos fluyan en la dirección especificada: TopToBottom, BottomToTop, LeftToRight o RightToLeft. Para obtener más información, vea Cómo: Navegar y examinar los documentos de gráfico.

  • Layout: establece el gráfico en los diseños siguientes: None, Sugiyama (diseño de árbol), ForceDirected (clústeres rápidos) o DependencyMatrix. Para obtener más información, vea Cómo: Navegar y examinar los documentos de gráfico.

  • NeighborhoodDistance: cuando el gráfico está establecido en el diseño de árbol o de clústeres rápidos, solo muestra aquellos nodos que están a un número especificado (1-7) de vínculos de los nodos seleccionados. Para obtener más información, vea Cómo: Navegar y examinar los documentos de gráfico.

  • Title: nombre del gráfico.

  • ZoomLevel: nivel de zoom usado para mostrar el gráfico inicialmente. Especifique un valor de punto flotante donde 1 es 100% o Fit para ajustar el gráfico al tamaño de la ventana.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" Background="Blue" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      ...
   </Nodes>
   <Links>
      ...
   </Links>
   <Categories>
      ...
   </Categories>
   <Properties>
      ...
   </Properties>
</DirectedGraph>

<Nodes></Nodes>

Este elemento opcional contiene una lista de elementos <Node/>, que definen nodos del gráfico. Para obtener más información, vea el elemento <Node/>.

NotaNota
Al hacer referencia a un nodo no definido en un elemento <Link/>, el gráfico crea un elemento <Node/> automáticamente. 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node ... />
   </Nodes>
   <Links>
      <Link ... />
   </Links>
</DirectedGraph>

<Node/>

Este elemento define un único nodo. Aparece dentro de la lista de elementos <Nodes><Nodes/>.

Este elemento debe incluir los atributos siguientes:

  • Id: nombre único del nodo y el valor predeterminado del atributo Label, si no se especifica ningún atributo Label independiente. Este nombre debe coincidir con el atributo Source o Target del vínculo que hace referencia a él.

En la lista siguiente se describen algunos atributos opcionales que puede incluir:

  • Label: nombre para mostrar del nodo.

  • Atributos de estilo. Para obtener más información, vea Aplicar estilos personalizados a nodos y vínculos.

  • Category: nombre de una categoría que identifica elementos que comparten este atributo. Para obtener más información, vea el elemento <Category/>.

  • Property: nombre de una propiedad que identifica elementos que tienen el mismo valor de propiedad. Para obtener más información, vea el elemento <Property/>.

  • Group: si el nodo contiene otros nodos, establezca este atributo en Expanded o Collapsed para mostrar u ocultar su contenido. Debe haber un elemento <Link/> que incluya el atributo Category="Contains" y especifique el nodo primario como nodo de origen y el nodo secundario como nodo de destino. Para obtener más información, vea Organizar nodos en grupos.

  • Visibility: establezca este atributo en Visible, Hidden o Collapsed. Utilice System.Windows.Visibility. Para obtener más información, vea Ocultar o mostrar nodos.

  • Reference: establezca este atributo para vincular un documento o una dirección URL. Para obtener más información, vea Vincular elementos a nodos.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node Id="Driver" Label="Student" Category="Person" />
      <Node Id="Passenger" Label="Instructor" Category="Person" />
      <Node Id="Car" Label="Car" Category="Automobile" />
      <Node Id="Truck" Label="Truck" ategory="Automobile" />
   </Nodes>
   <Links>
      <Link ... />
   </Links>
   <Categories>
      <Category Id="Person" Background="Orange" />
      <Category Id="Automobile" Background="Yellow"/>
   </Categories>
</DirectedGraph>

<Links></Links>

Este elemento contiene la lista de elementos <Link>, que definen vínculos entre nodos. Para obtener más información, vea el elemento <Link/>.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Links>
      <Link ... />
   </Links>
</DirectedGraph>

<Link/>

Este elemento define un único vínculo que conecta un nodo de origen con un nodo de destino. Aparece dentro de la lista de elementos <Links></Links>.

NotaNota
Si este elemento hace referencia a un nodo no definido, el documento de gráfico crea automáticamente un nodo que tiene los atributos especificados, si existe.

Este elemento debe incluir los atributos siguientes:

  • Source: nodo de origen del vínculo.

  • Target: nodo de destino del vínculo.

En la lista siguiente se describen algunos atributos opcionales que puede incluir:

  • Label: nombre para mostrar del vínculo.

  • Atributos de estilo. Para obtener más información, vea Aplicar estilos personalizados a nodos y vínculos.

  • Category: nombre de una categoría que identifica elementos que comparten este atributo. Para obtener más información, vea el elemento <Category/>.

  • Property: nombre de una propiedad que identifica elementos que tienen el mismo valor de propiedad. Para obtener más información, vea el elemento <Property/>.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node Id="Driver" Label="Student" Category="Person" />
      <Node Id="Passenger" Label="Instructor" Category="Person" />
      <Node Id="Car" Label="Car" Category="Automobile" />
      <Node Id="Truck" Label="Truck" Category="Automobile" />
   </Nodes>
   <Links>
      <Category Id="Person" Background="Orange" />
      <Category Id="Automobile" Background="Yellow"/>
      <Link Source="Driver" Target="Car" Label="Passed" Stroke="Black" Background="Green" Category="PassedTest" />
      <Link Source="Driver" Target="Truck" Label="Failed" Stroke="Black" Background="Red" Category="PassedTest" />
   </Links>
</DirectedGraph>

<Categories></Categories>

Este elemento contiene la lista de elementos <Category/>. Para obtener más información, vea el elemento <Category/>.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Categories>
       <Category ... />
   </Categories>
</DirectedGraph>

<Category/>

Este elemento define un atributo Category, que se emplea para identificar elementos que comparten este atributo. Se puede usar un atributo Category para organizar elementos de gráfico, proporcionar atributos compartidos a través de la herencia o definir metadatos adicionales.

Este elemento debe incluir los atributos siguientes:

  • Id: nombre único de la categoría y el valor predeterminado del atributo Label, si no se especifica ningún atributo Label independiente.

En la lista siguiente se describen algunos atributos opcionales que puede incluir:

  • Label: nombre de fácil lectura para la categoría.

  • BasedOn: categoría principal de la que se hereda el atributo <Category/> del elemento actual.

    En el ejemplo de este elemento, la categoría FailedTest hereda su atributo Stroke de la categoría PassedTest. Para obtener más información, vea "Para crear categorías jerárquicas" en Asignar categorías a nodos y vínculos.

Las categorías también proporcionan cierto comportamiento de plantilla básico que controla la apariencia de los nodos y vínculos cuando se muestran en un gráfico. Para obtener más información, vea Aplicar estilos personalizados a nodos y vínculos.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node Id="Driver" Label="Driver" Category="Person" />
      <Node Id="Car" Label="Car" Category="Automobile" />
      <Node Id="Truck" Label="Truck" Category="Automobile" />
      <Node Id="Passenger" Category="Person" />
   </Nodes>
   <Links>
      <Link Source="Driver" Target="Car" Label="Passed" Category="PassedTest" />
      <Link Source="Driver" Target="Truck" Label="Failed" Category="FailedTest" />
   </Links>
   <Categories>
      <Category Id="Person" Background="Orange" />
      <Category Id="Automobile" Background="Yellow"/>
      <Category Id="PassedTest" Label="Passed" Stroke="Black" Background="Green" />
      <Category Id="FailedTest" Label="Failed" BasedOn="PassedTest" Background="Red" />
   </Categories>
</DirectedGraph>

<Properties></Properties>

Este elemento contiene la lista de elementos <Property/>. Para obtener más información, vea el elemento <Property/>.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Properties>
       <Property ... />
   </Properties>
</DirectedGraph>

<Property/>

Este elemento define un atributo Property que puede usar para asignar un valor a cualquier elemento de DGML o atributo, incluyendo categorías y otras propiedades.

Este elemento debe incluir los atributos siguientes:

  • Id: nombre único de la propiedad y el valor predeterminado del atributo Label, si no se especifica ningún atributo Label independiente.

  • DataType: tipo de datos almacenados por la propiedad.

Si desea que la propiedad aparezca en la ventana Propiedades, use la propiedad Label para especificar el nombre para mostrar de la propiedad.

Para obtener más información, vea Asignar propiedades a nodos y vínculos.

 
<?xml version="1.0" encoding="utf-8"?>
<DirectedGraph Title="DrivingTest" xmlns="https://schemas.microsoft.com/vs/2009/dgml">
   <Nodes>
      <Node Id="Driver" Label="Driver" Category="Person" DrivingAge="18"/>
      <Node Id="Car" Label="Car" Category="Automobile" />
      <Node Id="Truck" Label="Truck" Category="Automobile" />
      <Node Id="Passenger" Category="Person" />
   </Nodes>
   <Links>
      <Link Source="Driver" Target="Car" Label="Passed" Category="PassedTest" />
      <Link Source="Driver" Target="Truck" Label="Failed" Category="FailedTest" />
   </Links>
   <Categories>
      <Category Id="Person" Background="Orange" />
      <Category Id="Automobile" Background="Yellow"/>
      <Category Id="PassedTest" Label="Passed" Stroke="Black" Background="Green" />
      <Category Id="FailedTest" Label="Failed" BasedOn="PassedTest" Background="Red" />
   </Categories>
   <Properties>
       <Property Id="DrivingAge" Label="Driving Age" DataType="System.Int32" />
   </Properties>
</DirectedGraph>

Vea también

Conceptos

Cómo: Generar gráficos de dependencia para código .NET

Otros recursos

Cómo: Navegar y examinar los documentos de gráfico

Como: Explorar el código con gráficos de dependencia