Opções do gráfico de linhas

Importar

import type { LineChartOptions } from "@sixtyfold/line";

Use o ponto de entrada público acima. As importações apenas de tipos são removidas do JavaScript da aplicação.

`BandOptions`

Opções visuais específicas por intervalo/faixa

Import @sixtyfold/lineinterface

interface BandOptions

Membro	Definição	Descrição
`borderColor?`	`string \| undefined`	Cor da borda partilhada para os limites superior e inferior (por omissão é a cor da série quando uma borda está ativada)
`borderStyle?`	`BandBorderStyle \| undefined` = `solid`	Estilo da linha da borda
`borderWidth?`	`number \| undefined`	Largura da borda em pixels. Defina 0 para desactivar bordas.
`fill?`	`number \| boolean \| undefined`	Preencher a banda. - false: sem preenchimento da banda - true: preencher com a cor da série à opacidade por omissão - número (0-1): preencher com a cor da série à opacidade especificada
`fillColor?`	`string \| SeriesGradient \| undefined`	Cor de preenchimento da banda — string de cor sólida ou objecto gradiente. Substitui a opacidade de preenchimento se especificada
`lowerBorderColor?`	`string \| undefined`	Substituir a cor para o limite inferior
`upperBorderColor?`	`string \| undefined`	Substituir cor do limite superior

`BarOptions`

Opções visuais específicas para barra/coluna

Importar @sixtyfold/lineinterface

interface BarOptions

Membro	Definição	Descrição
`baseline?`	`number \| undefined` = `0`	Valor de dados a partir do qual as barras crescem
`borderColor?`	`string \| undefined`	Cor partilhada da borda das barras (por defeito a cor da série quando a borda está ativada)
`borderStyle?`	`BarBorderStyle \| undefined` = `solid`	Estilo da linha da borda
`borderWidth?`	`number \| undefined`	Largura da borda em pixels. Defina para 0 para desativar bordas.
`fill?`	`number \| boolean \| undefined`	Preencher as barras. - false: sem preenchimento - true: preencher com a cor da série com opacidade por omissão - número (0-1): preencher com a cor da série com a opacidade especificada
`fillColor?`	`string \| SeriesGradient \| undefined`	Cor de preenchimento da barra — string de cor sólida ou objeto gradiente. Substitui a opacidade de preenchimento se especificada
`maxWidth?`	`number \| undefined` = `24`	Largura máxima da barra em pixels
`minWidth?`	`number \| undefined` = `1`	Largura mínima da barra em pixels
`widthRatio?`	`number \| undefined` = `0.7`	Fração do espaçamento de amostra disponível usada por cada barra

`LegendLabelFontOptions`

Opções para a fonte das etiquetas da legenda.

Import @sixtyfold/lineinterface

interface LegendLabelFontOptions

Membro	Definição	Descrição
`color?`	`string \| undefined` = `#cfd6e6`	Cor da fonte
`family?`	`string \| undefined` = `DEFAULT_CHART_FONT_FAMILY`	Família de fontes
`size?`	`number \| undefined` = `12`	Tamanho da fonte em px
`style?`	`"normal" \| "italic" \| "oblique" \| undefined` = `normal`	Estilo da fonte
`weight?`	`string \| number \| undefined` = `normal`	Peso da fonte
`width?`	`number \| undefined` = `auto`	Largura máxima do texto do rótulo em px

`LegendOptions`

Colocação, layout, tipografia, amostras de cor e interação para a legenda integrada Canvas2D.

Importar @sixtyfold/lineinterface

interface LegendOptions

Membro	Definição	Descrição
`align?`	`LegendAlign \| undefined` = `center`	Alinhamento na área da legenda
`allowHideAll?`	`boolean \| undefined` = `false`	Permitir ocultar todas as séries
`inactiveOpacity?`	`number \| undefined` = `0.45`	Opacidade para itens da legenda de séries ocultas
`interactive?`	`boolean \| undefined` = `false`	Ativar interação de clique para alternar
`itemGap?`	`number \| undefined` = `12`	Espaçamento entre itens em px
`labelFont?`	`LegendLabelFontOptions \| undefined`	Estilo de fonte do rótulo da legenda
`layout?`	`LegendLayout \| undefined` = `column`	Esquema de disposição dos itens
`padding?`	`{ top?: number; right?: number; bottom?: number; left?: number; } \| undefined` = `8`	Preenchimento dentro da área da legenda em px
`position?`	`LegendPosition \| undefined` = `right`	Posição da legenda em redor da área do gráfico
`swatch?`	`LegendSwatchOptions \| undefined`	Estilos de amostra (swatch)
`swatchGap?`	`number \| undefined` = `6`	Espaço entre a amostra e a etiqueta em px
`visible?`	`boolean \| undefined`	Mostra a legenda. Fica ativa por predefinição quando `legend` é fornecido; omitir `legend` desativa-a.

`LegendSwatchOptions`

Opções para a amostra (swatch) da legenda.

Import @sixtyfold/lineinterface

interface LegendSwatchOptions

Membro	Definição	Descrição
`borderColor?`	`string \| undefined` = `transparent`	Cor da borda do amostras
`borderWidth?`	`number \| undefined` = `0`	Largura da borda do amostras em px
`shape?`	`LegendSwatchShape \| undefined` = `circle`	Forma do amostras
`size?`	`number \| undefined` = `10`	Tamanho do amostras em px

`LineAppearanceOptions`

Aparência do gráfico de linhas — aparência base + legenda + marcador

Import @sixtyfold/lineinterface

interface LineAppearanceOptions extends BaseAppearanceOptions

Membro	Definição	Descrição
`axis?`	`AxisAppearanceOptions \| undefined`	Opções de aparência em tempo de execução para o eixo.
`chartBackground?`	`BackgroundOptions \| undefined`	Opções de aparência em tempo de execução para o fundo do gráfico.
`crosshairStyle?`	`CrosshairOptions \| undefined`	Opções de aparência em tempo de execução para o estilo do crosshair.
`grid?`	`GridOptions \| undefined`	Opções de aparência em tempo de execução para a grelha.
`labels?`	`ChartLabels \| undefined`	Opções de aparência em tempo de execução para rótulos.
`legend?`	`LegendOptions \| undefined`	Opções de aparência em tempo de execução para a legenda.
`marker?`	`MarkerOptions \| undefined`	Opções de aparência em tempo de execução para o marcador.
`overlay?`	`OverlayOptions \| undefined`	Opções de aparência em tempo de execução para a sobreposição.
`padding?`	`PaddingOptions \| undefined`	Opções de aparência em tempo de execução para o espaçamento (padding).
`rangeSelector?`	`RangeSelectorAppearanceOptions \| undefined`	Opções de aparência em tempo de execução para o seletor de intervalo.
`selection?`	`SelectionOptions \| undefined`	Opções de aparência em tempo de execução para a seleção.
`textDirection?`	`TextDirection \| undefined`	Opções de aparência em tempo de execução para a direção do texto.
`tooltip?`	`TooltipOptions \| undefined`	Opções de aparência em tempo de execução para a tooltip.

`LineChartOptions`

Opções de construção, interação, aparência, séries e LOD para um gráfico de linhas.

Import @sixtyfold/lineinterface

interface LineChartOptions

Membro	Definição	Descrição
`animated?`	`boolean \| undefined`	Animar a revelação de dados e as transições de viewport/eixos. Quando omitido, a animação é ativada, a menos que o navegador reporte `prefers-reduced-motion: reduce`.
`axis?`	`AxisOptions \| undefined`	Personalização do eixo (cor da linha e cores dos rótulos)
`chartBackground?`	`BackgroundOptions \| undefined` = `#16213e`	Fundo do gráfico (cobre todo o canvas incluindo a área de visualização). Pode ser uma string de cor sólida, definição de gradiente ou imagem.
`crosshairStyle?`	`CrosshairOptions \| undefined`	Estilo das linhas do crosshair (linhas guia vertical e horizontal)
`grid?`	`GridOptions \| undefined`	Personalização das linhas de grelha para o gráfico principal
`interactive?`	`boolean \| undefined` = `true`	Ativar interacções do utilizador (pan/zoom/pinch). Quando false, o gráfico é apenas de visualização, mas continua a mostrar crosshair/tooltip ao pairar.
`interpolation?`	`"none" \| "linear" \| "spline" \| undefined` = `linear`	Modo de interpolaçã o para valores entre pontos de dados - 'none': sem interpolaçã o, aproxima ao ponto de dados mais próximo - 'linear': interpolaçã o linear entre pontos adjacentes - 'spline': interpolaçã o Catmull-Rom para curvas suaves
`keepAliveInterval?`	`number \| undefined` = `0 (disabled)`	Intervalo de keep-alive em segundos para impedir que o Safari liberte recursos GPU. O Safari limpa agressivamente canvases “não utilizados”, causando gráficos em branco.
`keyboardActivation?`	`"focus" \| "hover" \| undefined`	Como os controlos do teclado ficam activos. - "focus" (por omissão): o gráfico deve ter foco DOM - "hover": o gráfico sob o ponteiro do rato recebe navegação por teclado
`keyboardAnnouncements?`	`false \| KeyboardAnnouncementMessages \| undefined`	Localize anúncios de ações do teclado para tecnologias assistivas, ou defina `false` para os desativar. Mensagens omitidas usam padrões concisos em inglês.
`keyboardPanSpeed?`	`number \| undefined` = `0.1 (10%)`	Velocidade de deslocamento por teclado (teclas de seta). Fração do intervalo visível para deslocar por pressionamento de tecla.1 (10%)
`keyboardZoomSpeed?`	`number \| undefined` = `0.1 (10% per keypress)`	Velocidade de zoom por teclado (teclas +/-). Valores mais altos = zoom mais rápido.1 (10% por pressionamento)
`labels?`	`ChartLabels \| undefined`	Etiquetas de texto em redor do gráfico (título, etiquetas de eixos)
`legend?`	`LegendOptions \| undefined`	Opções da legenda da série
`lod?`	`LineLODOptions \| undefined`	Política de apresentação do nível de detalhe.
`marker?`	`MarkerOptions \| undefined`	Estilo de marcador predefinido para pontos de hover (pode ser substituído por série)
`minViewportRange?`	`number \| undefined`	Menor extensão interativa do viewport X, expressa nas mesmas unidades dos valores X do gráfico. Valores inválidos ou não positivos mantêm o padrão do tipo de gráfico. Esta opção de construção não faz parte da aparência mutável.
`overlay?`	`OverlayOptions \| undefined`	Primitivas de sobreposição declarativas renderizadas acima do conteúdo do gráfico
`padding?`	`PaddingOptions \| undefined` = `{ top: 20, right: 80, bottom: 40, left: 80 }`	Espaçamento personalizado em pixels
`rangeSelector?`	`RangeSelectorOptions \| undefined`	Configuração do seletor de intervalo (gráfico de pré-visualização)
`rendererInitializationTimeout?`	`number \| undefined` = `15000`	Tempo máximo em milissegundos permitido para a inicialização do renderer. O watchdog inicia durante a construção do gráfico, pelo que também protege aplicações que não aguardam `BaseChart.initialize`. Defina como `0` para o desativar.
`renderMode?`	`"auto" \| "worker" \| "main" \| undefined`	Seleciona o modo de renderização. `auto` prefere Worker + OffscreenCanvas; `worker` força o worker com fallback para a thread principal; `main` renderiza na thread principal do browser e requer DOM.
`selection?`	`SelectionOptions \| undefined`	Estilo do intervalo de seleção (arrastar-para-zoom)
`series?`	`SeriesOptions[] \| undefined`	Configuração por série (cores, preenchimento, gradientes)
`textDirection?`	`TextDirection \| undefined` = `inherit`	Direção usada para texto em Canvas2D. Use "auto" para inferir a partir do primeiro carácter forte de cada string, ou "rtl"/"ltr" para forçar uma direção para todo o gráfico.
`tooltip?`	`TooltipOptions \| undefined`	Estilo da Tooltip (caixa de informação da cruzeta)
`wheelZoomDirection?`	`"up-in" \| "up-out" \| undefined`	Direção do zoom com roda do rato. - "up-in" (predefinição): roda para cima/para trás aproxima, roda para baixo/para a frente afasta - "up-out": roda para cima/para trás afasta, roda para baixo/para a frente aproxima
`wheelZoomSpeed?`	`number \| undefined` = `0.1 (10% per wheel tick)`	Velocidade do zoom com roda do rato. Valores mais altos = zoom mais rápido.1 (10% por tick da roda)
`yDomain?`	`YDomainOptions \| undefined`	Fixar uma ou ambas as extremidades do domínio Y renderizado. As extremidades omitidas continuam a autoescalar a partir dos dados visíveis. Fornecer ambas as extremidades finitas mantém a vista Y estável durante zoom, seleção de LOD e atualizações por streaming. A opção está desativada por predefinição e é configuração de construção em vez de aparência mutável.

`LineChartStatsOptions`

Controla com que frequência a telemetria da linha é publicada.

Import @sixtyfold/lineinterface

interface LineChartStatsOptions

Membro	Definição	Descrição
`intervalMs?`	`number \| undefined` = `250`	Intervalo mínimo entre atualizações de estatísticas em milissegundos

`LineDataUpdateOptions`

Controla a transição animada utilizada para uma substituição em massa de dados da linha.

Import @sixtyfold/lineinterface

interface LineDataUpdateOptions

Member	Definition	Description
`preservePreviousFrame?`	`boolean \| undefined`	Mantenha o gráfico anteriormente renderizado visível à frente da fronteira de revelação enquanto um conjunto de dados de substituição animado é desenhado. O padrão é false. Aguarde a conclusão da revelação anterior antes de usar esta opção; caso contrário, o quadro parcialmente revelado anterior, incluindo qualquer área em branco, será retido. Os píxeis retidos são estáticos, por isso pan ou zoom durante a nova revelação pode criar uma junta temporária entre grelha/dados até a transição terminar.

`LineLODOptions`

Política de apresentação estável em espaço de ecrã e coeficientes de fidelidade/suavidade.

Import @sixtyfold/lineinterface

interface LineLODOptions

Membro	Definição	Descrição
`density?`	`number \| undefined` = `0.75`	Colunas de apresentação alvo por pixel CSS e o controlo primário de fidelidade/trabalho. Valores maiores retêm mais detalhe local e aumentam o trabalho de renderização.
`mode?`	`"pyramid" \| "adaptive" \| undefined`	`adaptive` utiliza apresentação em espaço de ecrã consciente do viewport e estável quando suportado. `pyramid` seleciona entre os níveis globais predefinidos de LOD.
`quantizationStep?`	`number \| undefined` = `0.25`	Intervalo aditivo de grelha dentro de cada oitava binária. Valores mais pequenos permitem larguras de grelha mais próximas e reduzem saltos de texturas a custo de maiores consultas. Para transições suaves, combine isto com uma escala de rebase semelhante (por exemplo 0.1 com 1.1–1.12).
`rebaseRatio?`	`number \| undefined` = `1.25`	Deriva máxima projetada da largura das colunas antes de a grelha fixa (sticky) efetuar rebase. O limite inferior é o seu recíproco. Valores mais baixos produzem alterações de representação menores e mais frequentes.

`MarkerGlowOptions`

Efeito opcional de brilho para marcadores em hover

Import @sixtyfold/lineinterface

interface MarkerGlowOptions

Membro	Definição	Descrição
`blur?`	`number \| undefined` = `12`	Raio de desfocagem do brilho em pixels
`color?`	`string \| undefined`	Cor do brilho (por defeito a cor do preenchimento/marcador da série)
`opacity?`	`number \| undefined` = `0.45`	Opacidade do brilho 0-1

`MarkerOptions`

Opções de marcador para indicadores de ponto ao pairar

Importar @sixtyfold/lineinterface

interface MarkerOptions

Membro	Definição	Descrição
`borderColor?`	`string \| undefined` = `#fff`	Cor da borda/traço
`borderWidth?`	`number \| undefined` = `1`	Largura da borda/traço em pixels
`glow?`	`boolean \| MarkerGlowOptions \| undefined`	Brilho opcional em redor do marcador
`shape?`	`MarkerShape \| undefined` = `circle`	Forma do marcador
`size?`	`number \| undefined` = `5`	Tamanho do marcador em pixels — raio para círculos, meio‑largura para outros

`PointOptions`

Opções visuais específicas de scatter/pontos

Import @sixtyfold/lineinterface

interface PointOptions

Membro	Definição	Descrição
`borderColor?`	`string \| undefined` = `#fff`	Cor da borda/traço do ponto
`borderWidth?`	`number \| undefined` = `0`	Largura da borda/traço do ponto em pixels
`color?`	`string \| undefined`	Cor de preenchimento do ponto (por omissão, cor da série)
`opacity?`	`number \| undefined` = `1`	Opacidade do ponto 0-1
`shape?`	`MarkerShape \| undefined` = `circle`	Forma do ponto
`size?`	`number \| undefined` = `3`	Tamanho do ponto em pixels — raio para círculo, meio-largura para outros

`SeriesAppearanceOptions`

Campos de aparência por série — apenas visual e de apresentação

Importar @sixtyfold/linetipo

type SeriesAppearanceOptions = Pick<SeriesOptions, "type" | "color" | "fill" | "fillColor" | "fillToZero" | "fillEffect" | "band" | "bar" | "stack" | "point" | "width" | "name" | "unit" | "marker">

Membro	Definição	Descrição
`band?`	`BandOptions \| undefined`	Estilização de preenchimento e contorno específica por intervalo/faixa
`bar?`	`BarOptions \| undefined`	Estilização de preenchimento, contorno, largura e linha de base específica para barra/coluna
`color?`	`string \| undefined`	Cor da linha (recorre à paleta predefinida se não for especificada)
`fill?`	`number \| boolean \| undefined`	Preencher a área sob a linha. - false: sem preenchimento (predefinição) - true: preencher com a cor da linha a 40% de opacidade - número (0-1): preencher com a cor da linha na opacidade especificada
`fillColor?`	`string \| SeriesGradient \| undefined`	Cor de preenchimento — cadeia de cor sólida ou objeto gradiente. Substitui a opacidade de preenchimento se especificada
`fillEffect?`	`"none" \| "glow" \| "layered" \| undefined`	Efeito de estilo de preenchimento - 'none': preenchimento de cor plana (predefinição) - 'glow': brilho suave a emanar da linha - 'layered': preenchimentos empilhados com opacidades variadas para profundidade
`fillToZero?`	`boolean \| undefined` = `true`	Preencher até a linha de base zero em vez do fundo do gráfico Quando true: valores positivos preenchem até zero, negativos preenchem até zero por cima Quando false: preencher sempre até o fundo do gráfico
`marker?`	`MarkerOptions \| undefined`	Estilo do marcador para o ponto de passagem desta série (sobrescreve o marcador a nível do gráfico)
`name?`	`string \| undefined`	Nome de exibição da série (usado na legenda e no tooltip).
`point?`	`PointOptions \| undefined`	Estilização de marcadores específica para scatter/pontos
`stack?`	`StackOptions \| undefined`	Preenchimento específico de área empilhada e estilização da fronteira superior
`type?`	`LineSeriesType \| undefined` = `line`	Estilo de desenho da série. "step" é um alias de "step-after"; "band" é um alias de "range"; "points" é um alias de "scatter"; "column" é um alias de "bar"; "stackedArea" é um alias de "stacked-area".
`unit?`	`UnitOptions \| undefined`	Configuração de unidade para esta série (usada em tooltip e rótulos de eixos)
`width?`	`number \| undefined` = `1.5`	Largura do traço da linha em pixels. Defina como 0 para suprimir o traço mantendo os preenchimentos de intervalo, tooltips e outras camadas da série.

`SeriesGradient`

Definição de gradiente para o preenchimento da série

Import @sixtyfold/lineinterface

interface SeriesGradient

Membro	Definição	Descrição
`colors`	`string[]`	Paradas de cor CSS (mín. 2); cores inválidas são ignoradas.
`direction?`	`"vertical" \| "horizontal" \| undefined` = `vertical`	Direção do gradiente
`offsets?`	`number[] \| undefined`	Posições de deslocamento opcionais para cada cor (0-1), por omissão distribuídas uniformemente

`SeriesOptions`

Configuração para uma única série

Importar @sixtyfold/lineinterface

interface SeriesOptions

Membro	Definição	Descrição
`band?`	`BandOptions \| undefined`	Estilo de preenchimento e borda específico por intervalo/faixa
`bar?`	`BarOptions \| undefined`	Estilo de preenchimento, borda, largura e linha de base específico para barras/colunas
`color?`	`string \| undefined`	Cor da linha (recorre à paleta predefinida se não especificada)
`fill?`	`number \| boolean \| undefined`	Preenche a área sob a linha. - false: sem preenchimento (predefinição) - true: preenche com a cor da linha a 40% de opacidade - número (0-1): preenche com a cor da linha à opacidade especificada
`fillColor?`	`string \| SeriesGradient \| undefined`	Cor de preenchimento — string de cor sólida ou objeto gradiente. Substitui a opacidade de preenchimento se especificada
`fillEffect?`	`"none" \| "glow" \| "layered" \| undefined`	Efeito de estilo de preenchimento — 'none': preenchimento a cor plana (predefinição) — 'glow': brilho suave a emitir da linha — 'layered': preenchimentos empilhados com opacidades variáveis para profundidade
`fillToZero?`	`boolean \| undefined` = `true`	Preencher até a linha de base zero em vez do fundo do gráfico Quando true: valores positivos preenchem até zero para baixo, negativos preenchem até zero para cima Quando false: preenche sempre até o fundo do gráfico
`marker?`	`MarkerOptions \| undefined`	Estilo do marcador para o ponto em hover desta série (substitui o marcador a nível do gráfico)
`name?`	`string \| undefined`	Nome de exibição da Série (usado na legenda e na dica de ferramenta).
`point?`	`PointOptions \| undefined`	Estilização de marcador específica para scatter/pontos
`stack?`	`StackOptions \| undefined`	Preenchimento específico de stacked-area e estilização do limite superior
`type?`	`LineSeriesType \| undefined` = `line`	Estilo de desenho da Série. "step" é um alias de "step-after"; "band" é um alias de "range"; "points" é um alias de "scatter"; "column" é um alias de "bar"; "stackedArea" é um alias de "stacked-area".
`unit?`	`UnitOptions \| undefined`	Configuração de unidades para esta série (utilizada em tooltip e rótulos de eixo)
`width?`	`number \| undefined` = `1.5`	Largura do traço da linha em pixels. Defina para 0 para suprimir o traço mantendo os preenchimentos de intervalo, tooltips e outras camadas da série.

`StackOptions`

Opções visuais específicas para áreas empilhadas

Import @sixtyfold/lineinterface

interface StackOptions

Member	Definition	Description
`borderColor?`	`string \| undefined`	Cor da borda superior (por omissão, cor da série)
`borderStyle?`	`StackBorderStyle \| undefined` = `solid`	Estilo da linha da borda superior
`borderWidth?`	`number \| undefined`	Espessura da borda superior em pixels (por omissão, espessura da série). Defina como 0 para desativar.
`curve?`	`StackCurveStyle \| undefined` = `linear`	Forma da fronteira para a banda preenchida e a borda superior.
`fill?`	`number \| boolean \| undefined`	Preencher a área empilhada. - false: sem preenchimento da área - true: preencher com a cor da série com opacidade por defeito - número (0-1): preencher com a cor da série com a opacidade especificada
`fillColor?`	`string \| SeriesGradient \| undefined`	Cor de preenchimento da área - string de cor sólida ou objeto de gradiente. Substitui a opacidade de preenchimento se especificada