IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Candlestick: Add tooltip options (#81307)

Browse Source
This commit is contained in:
Adela Almasan 2024-01-26 10:02:44 -06:00 committed by GitHub
parent 8ca080d47c
commit 09fcb3c6cc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/grafana-ui/src/options/builder/tooltip.tsx
View File

@ -3,7 +3,8 @@ import { OptionsWithTooltip, TooltipDisplayMode, SortOrder } from '@grafana/sche
export function addTooltipOptions<T extends OptionsWithTooltip>( export function addTooltipOptions<T extends OptionsWithTooltip>(
builder: PanelOptionsEditorBuilder<T>, builder: PanelOptionsEditorBuilder<T>,
singleOnly = false singleOnly = false,
defaultOptions?: Partial<OptionsWithTooltip>
) { ) {
const category = ['Tooltip']; const category = ['Tooltip'];
const modeOptions = singleOnly const modeOptions = singleOnly
@ -28,7 +29,7 @@ export function addTooltipOptions<T extends OptionsWithTooltip>(
path: 'tooltip.mode', path: 'tooltip.mode',
name: 'Tooltip mode', name: 'Tooltip mode',
category, category,
defaultValue: 'single', defaultValue: defaultOptions?.tooltip?.mode ?? TooltipDisplayMode.Single,
settings: { settings: {
options: modeOptions, options: modeOptions,
}, },
@ -37,7 +38,7 @@ export function addTooltipOptions<T extends OptionsWithTooltip>(
path: 'tooltip.sort', path: 'tooltip.sort',
name: 'Values sort order', name: 'Values sort order',
category, category,
defaultValue: SortOrder.None, defaultValue: defaultOptions?.tooltip?.sort ?? SortOrder.None,
showIf: (options: T) => options.tooltip?.mode === TooltipDisplayMode.Multi, showIf: (options: T) => options.tooltip?.mode === TooltipDisplayMode.Multi,
settings: { settings: {
options: sortOptions, options: sortOptions,

10
public/app/plugins/panel/candlestick/CandlestickPanel.tsx
View File

@ -266,7 +266,9 @@ export const CandlestickPanel = ({
{showNewVizTooltips ? ( {showNewVizTooltips ? (
<TooltipPlugin2 <TooltipPlugin2
config={uplotConfig} config={uplotConfig}
hoverMode={TooltipHoverMode.xAll} hoverMode={
options.tooltip.mode === TooltipDisplayMode.Single ? TooltipHoverMode.xOne : TooltipHoverMode.xAll
}
queryZoom={onChangeTimeRange} queryZoom={onChangeTimeRange}
clientZoom={true} clientZoom={true}
render={(u, dataIdxs, seriesIdx, isPinned = false, dismiss, timeRange2, viaSync) => { render={(u, dataIdxs, seriesIdx, isPinned = false, dismiss, timeRange2, viaSync) => {
@ -293,14 +295,14 @@ export const CandlestickPanel = ({
seriesFrame={alignedDataFrame} seriesFrame={alignedDataFrame}
dataIdxs={dataIdxs} dataIdxs={dataIdxs}
seriesIdx={seriesIdx} seriesIdx={seriesIdx}
mode={TooltipDisplayMode.Multi} mode={options.tooltip.mode}
isPinned={isPinned} isPinned={isPinned}
annotate={enableAnnotationCreation ? annotate : undefined} annotate={enableAnnotationCreation ? annotate : undefined}
/> />
); );
}} }}
maxWidth={options.tooltip?.maxWidth} maxWidth={options.tooltip.maxWidth}
maxHeight={options.tooltip?.maxHeight} maxHeight={options.tooltip.maxHeight}
/> />
) : ( ) : (
<> <>

5
public/app/plugins/panel/candlestick/module.tsx
View File

@ -137,7 +137,10 @@ export const plugin = new PanelPlugin<Options, GraphFieldConfig>(CandlestickPane
}, },
}); });
// commonOptionsBuilder.addTooltipOptions(builder); if (config.featureToggles.newVizTooltips) {
commonOptionsBuilder.addTooltipOptions(builder, false, opts);
}
commonOptionsBuilder.addLegendOptions(builder); commonOptionsBuilder.addLegendOptions(builder);
}) })
.setDataSupport({ annotations: true, alertStates: true }) .setDataSupport({ annotations: true, alertStates: true })

6
public/app/plugins/panel/candlestick/types.ts
View File

@ -1,4 +1,4 @@
import { LegendDisplayMode } from '@grafana/schema'; import { LegendDisplayMode, SortOrder, TooltipDisplayMode } from '@grafana/schema';
import { import {
defaultOptions as defaultOptionsBase, defaultOptions as defaultOptionsBase,
@ -21,6 +21,10 @@ export const defaultOptions: Partial<Options> = {
placement: 'bottom', placement: 'bottom',
calcs: [], calcs: [],
}, },
tooltip: {
mode: TooltipDisplayMode.Multi,
sort: SortOrder.None,
},
}; };
export { export {