|
|
|
@ -24,7 +24,6 @@ export function Panel({ options, data, width, height, timeRange, onChangeTimeRan
|
|
|
|
|
const podContainerRef = useRef<HTMLDivElement>(null); |
|
|
|
|
|
|
|
|
|
const podContainer = useMemo(() => { |
|
|
|
|
|
|
|
|
|
const chartClickHandler = (event: React.MouseEvent<HTMLDivElement>) => { |
|
|
|
|
event.preventDefault(); |
|
|
|
|
if (options.gauge.link === undefined || options.gauge.link === '') { |
|
|
|
@ -39,10 +38,7 @@ export function Panel({ options, data, width, height, timeRange, onChangeTimeRan
|
|
|
|
|
if (options.visualizationType === Pod.BAR) { |
|
|
|
|
containerHeight = height - 20; |
|
|
|
|
} |
|
|
|
|
if ( |
|
|
|
|
options.visualizationType === Pod.GAUGE && |
|
|
|
|
options.gauge.additionalInfo.display |
|
|
|
|
) { |
|
|
|
|
if (options.visualizationType === Pod.GAUGE && options.gauge.additionalInfo.display) { |
|
|
|
|
containerHeight = height - options.gauge.additionalInfo.size - 8; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -97,19 +93,21 @@ export function Panel({ options, data, width, height, timeRange, onChangeTimeRan
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
additionalInfo = <div |
|
|
|
|
className={css` |
|
|
|
|
width: ${width}px; |
|
|
|
|
height: ${additionalInfoConfig.size + 8}px; |
|
|
|
|
font-size: ${additionalInfoConfig.size}px; |
|
|
|
|
color: ${additionalInfoConfig.color}; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
`}
|
|
|
|
|
> |
|
|
|
|
{additionalInfoConfig.prefix} {value !== undefined ? formatValue(value, additionalInfoConfig) : '-'} |
|
|
|
|
</div> |
|
|
|
|
additionalInfo = ( |
|
|
|
|
<div |
|
|
|
|
className={css` |
|
|
|
|
width: ${width}px; |
|
|
|
|
height: ${additionalInfoConfig.size + 8}px; |
|
|
|
|
font-size: ${additionalInfoConfig.size}px; |
|
|
|
|
color: ${additionalInfoConfig.color}; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
`}
|
|
|
|
|
> |
|
|
|
|
{additionalInfoConfig.prefix} {value !== undefined ? formatValue(value, additionalInfoConfig) : '-'} |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
return ( |
|
|
|
|
<div> |
|
|
|
|