Diagrama de líneas

Genera un gráfico de líneas para un conjunto de datos, con la opción de añadir árboles detallados para conjuntos de datos adicionales. Puede llenar el conjunto de datos de forma estática o utilizando un servicio.

Restricción

El Diagrama de líneas se debe rellenar utilizando un flujo de servicios con acceso adecuado a Ajax.

Nota: Si encuentra problemas de dimensionamiento al visualizar el gráfico en un panel contraíble, utilice el código siguiente en el suceso On expand del panel contraíble para ajustar el tamaño del gráfico al espacio disponible: ${CHART_CONTROL_ID}.refresh();

Propiedades de configuración

En Configuración, establezca o modifique las propiedades de aspecto y comportamiento de la vista.

Tamaño de pantalla: Una propiedad de configuración que tenga el icono Tamaños de pantalla junto al nombre de propiedad puede tener distintos valores para cada tamaño de pantalla. Si no define un valor, el tamaño de la pantalla hereda el valor del siguiente tamaño de pantalla más grande como valor predeterminado.

Definiciones de temas: Las definiciones de temas especifican los colores y los estilos de una vista y determinan su aspecto. Puede obtener una vista previa del aspecto de las vistas en el editor de temas. Consulte Temas.

En la tabla siguiente se muestran las propiedades de configuración del aspecto para la vista Diagrama de líneas:

Tabla 1. Propiedades de configuración de aspecto para Diagrama de líneas
Propiedad de configuración del aspecto	Descripción	Tipo de datos
Línea suavizada	Suaviza la curva que conecta los puntos de datos.	`Boolean`
Estilo de color de fondo	El estilo de color del color de fondo.	`String`
Estilo de color de serie de datos	El estilo de color de la serie de datos.	`String`
Estilo de color personalizado de serie de datos	Personalice el estilo de color de la serie de datos. En `NameValuePair`, `Name` es el nombre de la serie y `Value` es el color especificado como nombre, código hexadecimal o código RGB. Por ejemplo, `red`, `#ff0000`, `rgb(255, 0, 0)`. La propiedad tiene prioridad sobre Color de serie de datos.	`NameValuePair`
Mostrar etiquetas de valor	Muestra valores de punto de datos sobre cada punto del gráfico.	`Boolean`
Mostrar rastros de navegación	Cuando se habilita esta opción, el título muestra la posición actual del árbol en el que el usuario puede descender a mayor nivel de detalle (en función de la selección del menú).	`Boolean`
Cuerpo	El tamaño del punto que marca el valor. Valor predeterminado: 2,5 píxeles.	`Decimal`
Estilo de color de ejes XY	El estilo de color de los ejes X e Y.	`String`
Estilo de líneas de cuadrícula	El estilo de las líneas de cuadrícula horizontales.	`String`
Rotación de etiqueta X	La rotación, en grados, de la etiqueta del eje x.	`Decimal`
Altura del eje X	La altura del eje X.	`Integer`
Radio de borde	El radio del gráfico.	`String`
Relleno	El relleno para la parte derecha, superior, izquierda e inferior del gráfico (en píxeles).	`String`
Altura	La altura del gráfico.	`Integer`

En la tabla siguiente se muestran las propiedades de configuración del comportamiento para la vista Diagrama de líneas:

Tabla 2. Propiedades de configuración de comportamiento para Diagrama de líneas
Propiedad de configuración del comportamiento	Descripción	Tipo de datos
Modalidad de datos de gráfico	Seleccione si desea llenar los datos de gráfico de un servicio o de la opción de configuración. Tenga en cuenta que los árboles en los que los usuarios pueden descender a mayor nivel de detalle solo están disponibles si se rellenan a través de un flujo de servicio con el acceso a Ajax apropiado.	`String`
Servicio de datos	Un servicio que rellena la serie de datos.	`Ajax service`
Serie de datos	El parámetro `seriesName` es el nombre de la serie de datos, y `dataPoints` es la lista de puntos de datos que se deben incluir en dicha serie de datos.	`String` para `seriesName` y `DataPoint[]` para la lista de `dataPoints`.
Menú Habilitar	Habilita la visibilidad del menú. El menú es necesario si tiene un árbol en el que los usuarios puedan descender a mayor nivel de detalle o si ha añadido menús.	`Boolean`
Número de marcas de eje Y	El número de marcas en el eje Y. El valor que especifique no se interpretará como un número exacto sino que se ajustará al recuento de marcas más idóneo para ofrecer un visualización óptima.	`Integer`
Precisión de marca de eje Y	Número de posiciones decimales que se deben visualizar para las etiquetas de valor del eje Y. El número predeterminado de posiciones decimales es 0.	`Integer`
Valor mínimo de eje Y	El valor mínimo en eje Y .	`Decimal`
Valor máximo de eje Y	El valor máximo en eje Y .	`Decimal`
Utilizar recorte de exceso de eje X	Muestre solo el número de recuentos de marca de datos del eje x, determinado por el valor de la propiedad Recuento máximo de marcas en X.	`Boolean`
Número de marcas de eje X	El número de marcas en el eje X. El valor que especifique no se interpretará como un número exacto sino que se ajustará al recuento de marcas más idóneo para ofrecer un visualización óptima.	`Integer`
Mostrar ayuda contextual	Cuando esta opción está habilitada, pasar el puntero del ratón sobre los puntos de datos del gráfico con el ratón hace que aparezca una ayuda contextual. La ayuda contextual muestra el nombre del punto y su valor.	`Boolean`

Para obtener información sobre los árboles detallados que puede utilizar con los gráficos, consulte Árboles detallados.

Sucesos

Establezca o modifique los manejadores de sucesos para la vista en las propiedades de Sucesos. Puede establecer que los sucesos se activen mediante programación o cuando un usuario interactúe con la vista. Para obtener información sobre cómo definir y codificar sucesos, consulte Sucesos definidos por el usuario. La vista Gráfico de líneas tiene los siguientes tipos de manejadores de sucesos:

On load: Se activa cuando se carga el gráfico, por ejemplo,
```
me.defocusSeries("Brand1")
```
On refreshed: Se activa cuando se renueva el gráfico, por ejemplo,
```
me.focusSeries("Brand1")
```
On click: Se activa cuando se pulsa el gráfico, por ejemplo,
```
me.transform("donut", ["Brand1","Brand2"])
```

On menu action: Se activa cuando se detecta una acción de menú, por ejemplo,

console.log("Running menu action '" + action.name + "' on " + me.getSelectedDataPoint().label + " with value of " + me.getSelectedDataPoint().value)

Navegación con el teclado

Para navegar por los gráficos utilizando el teclado:

Pulse Tab hasta que se resalte el gráfico que desea.
Pulse Tab para obtener el foco dentro del gráfico.
Utilice las teclas de flecha derecha, izquierda, arriba o abajo para navegar dentro del gráfico.
Nota: Para navegar por el gráfico tal como se describe, debe utilizar el lector de pantalla JAWS.

Métodos

Para obtener información sobre los métodos para el gráfico de líneas, consulte la API Diagrama de líneas JavaScript .

Recursos adicionales

Para obtener información sobre cómo crear un coach o una página, consulte Creación de coaches.
Para obtener información sobre las propiedades estándar (General, Configuración, Posicionamiento, Visibilidady Atributos HTML), consulte Ver propiedades.