Добавлены ограничения для размещения тултипа графика ЕСО

This commit is contained in:
goodmice 2022-08-10 14:39:03 +05:00
parent fc6646eb80
commit 15333510fd
2 changed files with 7 additions and 8 deletions

View File

@ -31,7 +31,7 @@ const defaultProps: WellIconProps = {
}
export const WellIcon = React.memo(({ width, height, state, online, colors, ...other } : WellIconProps = defaultProps) => {
colors = {...defaultColors, ...colors}
colors = { ...defaultColors, ...colors }
return (
<svg
@ -59,9 +59,9 @@ export const WellIcon = React.memo(({ width, height, state, online, colors, ...o
</g>
{online && ( // Полоски, показывающие наличие свежей телеметрии
<g stroke={colors.online}>
<path d="m18.4 0.0662a2 2 0 0 1 0.141 1.7 2 2 0 0 1-1.22 1.19"/>
<path d="m19.5 0.0402a3 3 0 0 1-1.79 3.85"/>
<path d="m20.5 0.031a4 4 0 0 1-2.5 4.79"/>
<path d={'m18.4 0.0662a2 2 0 0 1 0.141 1.7 2 2 0 0 1-1.22 1.19'} />
<path d={'m19.5 0.0402a3 3 0 0 1-1.79 3.85'} />
<path d={'m20.5 0.031a4 4 0 0 1-2.5 4.79'} />
</g>
)}
</svg>

View File

@ -137,8 +137,7 @@ export const TLChart = memo(({
.selectAll('rect')
.filter((d) => d.idCategory === data.idCategory)
.attr('stroke-width', '2px')
const rect = e.target.getBoundingClientRect()
setTooltipPos({ x: rect.x, y: rect.y })
setTooltipPos(e.target.getBoundingClientRect())
setSelected(data)
})
.on('mouseout', (e, data) => {
@ -153,8 +152,8 @@ export const TLChart = memo(({
const tooltipStyle = useMemo(() => {
return {
...tooltipSize,
left: tooltipPos.x - tooltipSize.width - 8,
top: tooltipPos.y - tooltipSize.height / 2 + barHeight / 2,
left: Math.min(tooltipPos.x, screen.width) - tooltipSize.width - 8,
top: Math.min(tooltipPos.y - tooltipSize.height / 2 + barHeight / 2, screen.height - tooltipSize.height - 160),
}
}, [tooltipPos, tooltipSize, barHeight])