diff --git a/resources/views/filament/admin/widgets/server-charts.blade.php b/resources/views/filament/admin/widgets/server-charts.blade.php index 75cc270..4b4e62d 100644 --- a/resources/views/filament/admin/widgets/server-charts.blade.php +++ b/resources/views/filament/admin/widgets/server-charts.blade.php @@ -441,14 +441,17 @@ this.tooltipEl.style.opacity = '1'; const rect = this.$refs.chart.getBoundingClientRect(); const tooltipRect = this.tooltipEl.getBoundingClientRect(); + const padding = 8; let left = x + 12; let top = y - tooltipRect.height - 12; - if (left + tooltipRect.width > rect.width) { + if (left + tooltipRect.width + padding > rect.width) { left = x - tooltipRect.width - 12; } - if (top < 0) { + if (top < padding) { top = y + 12; } + left = Math.min(Math.max(padding, left), rect.width - tooltipRect.width - padding); + top = Math.min(Math.max(padding, top), rect.height - tooltipRect.height - padding); this.tooltipEl.style.transform = `translate(${left}px, ${top}px)`; }, hideTooltip() { @@ -736,14 +739,17 @@ this.tooltipEl.style.opacity = '1'; const rect = this.$refs.chart.getBoundingClientRect(); const tooltipRect = this.tooltipEl.getBoundingClientRect(); + const padding = 8; let left = x + 12; let top = y - tooltipRect.height - 12; - if (left + tooltipRect.width > rect.width) { + if (left + tooltipRect.width + padding > rect.width) { left = x - tooltipRect.width - 12; } - if (top < 0) { + if (top < padding) { top = y + 12; } + left = Math.min(Math.max(padding, left), rect.width - tooltipRect.width - padding); + top = Math.min(Math.max(padding, top), rect.height - tooltipRect.height - padding); this.tooltipEl.style.transform = `translate(${left}px, ${top}px)`; }, hideTooltip() { @@ -902,14 +908,17 @@ this.tooltipEl.style.opacity = '1'; const rect = this.$refs.chart.getBoundingClientRect(); const tooltipRect = this.tooltipEl.getBoundingClientRect(); + const padding = 8; let left = x + 12; let top = y - tooltipRect.height - 12; - if (left + tooltipRect.width > rect.width) { + if (left + tooltipRect.width + padding > rect.width) { left = x - tooltipRect.width - 12; } - if (top < 0) { + if (top < padding) { top = y + 12; } + left = Math.min(Math.max(padding, left), rect.width - tooltipRect.width - padding); + top = Math.min(Math.max(padding, top), rect.height - tooltipRect.height - padding); this.tooltipEl.style.transform = `translate(${left}px, ${top}px)`; }, hideTooltip() {