@grafana/data APIs
- SelectableValue
- DataQuery
- DataSourceJsonData
- PanelProps
- PanelPlugin
- DataFrame
- DataSourcePluginOptionsEditorProps
- DataSourceInstanceSettings
- FieldType
- DataSourcePlugin
- DataSourceApi
- MetricFindValue
- PanelEditorProps
- GrafanaTheme
- getDisplayProcessor
- DataQueryError
- DataQueryRequest
- DataQueryResponse
- MutableDataFrame
- ArrayVector
- LoadingState
- KeyValue
- AppPluginMeta
- PluginMeta
- AppPlugin
- NavModelItem
- ThresholdsMode
- DisplayValue
- formattedValueToString
- FieldConfig
- FieldColorMode
- GraphSeriesValue
- FieldDisplayOptions
- GraphSeriesXY
- TimeZone
- MS_DATE_TIME_FORMAT
- DEFAULT_DATE_TIME_FORMAT
- ReducerID
- AppEvents
- DataSourceSelectItem
- NullValueMode
- getFlotPairs
- getValueFormat
- AbsoluteTimeRange
- AnnotationEvent
- PanelData
- getTimeField
- reduceField
- getSeriesTimeStep
- hasMsResolution
- FieldColor
- MutableField
- AppRootProps
- GrafanaThemeType
- PanelPluginMeta
- ScopedVars
- PluginBuildInfo
- PluginState
- VizOrientation
- Field
- TimeSeriesValue
- FormattedValue
- DisplayValueAlignmentFactors
- getColorFromHexRgbOrName
- getColorDefinitionByName
- getNamedColorPalette
- getColorName
- getColorForTheme
- deprecationWarning
- DataLink
- VariableSuggestion
- VariableOrigin
- LinkModelSupplier
- DataSourceSettings
- applyFieldOverrides
- FieldConfigSource
- InterpolateFunction
- FieldMatcherID
- toDataFrame
- standardFieldConfigEditorRegistry
- FieldOverrideContext
- FieldConfigEditorProps
- FieldOverrideEditorProps
- ValueMapping
- toIntegerOrUndefined
- toFloatOrUndefined
- FieldPropertyEditorItem
- ThresholdsConfig
- getActiveThreshold
- Threshold
- dateTime
- TimeRange
- DefaultTimeZone
- createDimension
- DateTimeInput
- FlotDataPoint
- getValueFromDimension
- getColumnFromDimension
- FieldCache
- LogRowModel
- LogLevel
- calculateFieldStats
- calculateLogsLabelStats
- calculateStats
- getParser
- LinkModel
- Labels
- findHighlightChunksInText
- LogsDedupStrategy
- fieldMatchers
- Registry
- stringToMs
- DEFAULT_FIELD_DISPLAY_VALUES_LIMIT
- toNumberString
- VAR_SERIES_NAME
- VAR_FIELD_NAME
- VAR_CALC
- VAR_CELL_PREFIX
- fieldReducers
- sortThresholds
- MappingType
- PanelModel
- ConfigOverrideRule
- validateFieldConfig
- readCSV
- DateTime
- dateTimeAsMoment
- TimeFragment
- isDateTime
- rangeUtil
- TIME_FORMAT
- TimeOption
- dateMath
- dateTimeForTimeZone
- getTimeZoneGroups
- RawTimeRange
- FilterFieldsByNameTransformerOptions
- DataTransformerID
- transformersRegistry
- FilterFramesByRefIdTransformerOptions
- ReduceTransformerOptions
- DataTransformerConfig
- transformDataFrame
- getValueFormats
- GrafanaThemeCommons
- setLocale
- setMarkdownOptions
- escapeStringForRegex
- unEscapeStringFromRegex
- UserOrgDTO
- NavModel
- NavModelBreadcrumb
- renderMarkdown
- LogsMetaKind
- findCommonLabels
- findUniqueLabels
- getLogLevel
- getLogLevelFromKey
- LogsModel
- LogsMetaItem
- toUtc
- FieldWithIndex
- NavIndex
- PanelEvents
- OrgRole
- eventFactory
- TableData
- Column
- ValueFormatter
- stringToJsRegex
- DecimalCount
- AppEvent
- ExploreMode
- CoreApp
- HistoryItem
- IntervalValues
- toCSV
- DynamicConfigValue
- FieldConfigEditorRegistry
- VariableSuggestionsScope
- DefaultTimeRange
- toDataFrameDTO
- PanelMenuItem
- PluginType
- toLegacyResponseData
- DataQueryResponseData
- guessFieldTypes
- DataSourcePluginMeta
- DataSourceConstructor
- PluginInclude
- PluginMetaInfo
- toDuration
- LogsDedupDescription
- QueryFixAction
- TimeSeries
- LegacyResponseData
- AngularPanelMenuItem
- FieldDisplay
- DataFrameView
- GrafanaPlugin
- PluginDependencies
- PluginIncludeType
- onUpdateDatasourceJsonDataOptionSelect
- onUpdateDatasourceOption
- onUpdateDatasourceResetOption
- onUpdateDatasourceJsonDataOption
- onUpdateDatasourceSecureJsonDataOption
- updateDatasourcePluginOption
- updateDatasourcePluginResetOption
- updateDatasourcePluginJsonDataOption
- updateDatasourcePluginSecureJsonDataOption
- ExploreStartPageProps
- DataFrameDTO
- AnnotationQueryRequest
- LanguageProvider
- formatLabels
- parseLabels
- CircularDataFrame
- QueryHint
- isDataFrame
- QueryFix
- CSVReader
- DurationUnit
- getFieldDisplayValues
- getDisplayValueAlignmentFactors
- getFlotPairsConstant
- CreatePlotOverlay
- isTableData
- stringStartsAsRegEx
- base64StringToArrowTable
- arrowTableToDataFrame
- FieldConfigProperty
Other Related APIs
- react#ReactNode
- react#CSSProperties
- react#PureComponent
- @grafana/data#PanelProps
- @grafana/data#VizOrientation
- @grafana/data#ThresholdsMode
- @grafana/data#DisplayValue
- @grafana/data#TimeSeriesValue
- @grafana/data#formattedValueToString
- @grafana/data#FormattedValue
- @grafana/data#FieldConfig
- @grafana/data#FieldColorMode
- @grafana/data#getColorFromHexRgbOrName
- @grafana/data#GraphSeriesValue
- @grafana/data#ReducerID
- @grafana/data#FieldDisplay
- @grafana/data#getFieldDisplayValues
- @grafana/data#getDisplayValueAlignmentFactors
@grafana/data#DisplayValueAlignmentFactors TypeScript Examples
The following examples show how to use
@grafana/data#DisplayValueAlignmentFactors.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: BarGaugePanel.tsx From grafana-chinese with Apache License 2.0 | 6 votes |
renderValue = (
value: FieldDisplay,
width: number,
height: number,
alignmentFactors: DisplayValueAlignmentFactors
): JSX.Element => {
const { options } = this.props;
const { field, display, view, colIndex } = value;
return (
<DataLinksContextMenu links={getFieldLinksSupplier(value)}>
{({ openMenu, targetClassName }) => {
return (
<BarGauge
value={display}
width={width}
height={height}
orientation={options.orientation}
field={field}
display={view?.getFieldDisplayProcessor(colIndex)}
theme={config.theme}
itemSpacing={this.getItemSpacing()}
displayMode={options.displayMode}
onClick={openMenu}
className={targetClassName}
alignmentFactors={alignmentFactors}
showUnfilled={options.showUnfilled}
/>
);
}}
</DataLinksContextMenu>
);
};
Example #2
Source File: StatPanel.tsx From grafana-chinese with Apache License 2.0 | 5 votes |
renderValue = (
value: FieldDisplay,
width: number,
height: number,
alignmentFactors: DisplayValueAlignmentFactors
): JSX.Element => {
const { timeRange, options } = this.props;
let sparkline: BigValueSparkline | undefined;
if (value.sparkline) {
sparkline = {
data: value.sparkline,
xMin: timeRange.from.valueOf(),
xMax: timeRange.to.valueOf(),
yMin: value.field.min,
yMax: value.field.max,
};
const calc = options.fieldOptions.calcs[0];
if (calc === ReducerID.last) {
sparkline.highlightIndex = sparkline.data.length - 1;
}
}
return (
<DataLinksContextMenu links={getFieldLinksSupplier(value)}>
{({ openMenu, targetClassName }) => {
return (
<BigValue
value={value.display}
sparkline={sparkline}
colorMode={options.colorMode}
graphMode={options.graphMode}
justifyMode={options.justifyMode}
alignmentFactors={alignmentFactors}
width={width}
height={height}
theme={config.theme}
onClick={openMenu}
className={targetClassName}
/>
);
}}
</DataLinksContextMenu>
);
};