Dashboard Global Map: Fix map positioning, scrolling behavior and improve information layout #6

New Issue

2026-07-25T18:47:18Z

tech commented

2026-07-25 18:47:18 +00:00

Problem

The Global Attack Map on /dashboard does not behave correctly during page scrolling.

Current issues:

The map moves in an unexpected way when scrolling.
The position is not stable.
The visualization feels disconnected from the dashboard layout.
Information overlays are not optimally positioned.
The map does not provide a clean SOC operator experience.

Expected behavior

The Global Attack Map should behave as a fixed dashboard component.

Requirements:

The map container must remain stable while scrolling.
The map must not move, jump or resize unexpectedly.
The viewport and map boundaries should remain consistent.
The layout must be responsive for different screen sizes.

The operator should always understand:

where attacks originate
where they are targeting
attack severity
live event activity

without the map interfering with page navigation.

Layout improvements

Redesign the dashboard layout so the Global Map has a dedicated area.

+--------------------------------------+
| Security Metrics |
+--------------------------------------+

The map should not overlap other dashboard elements.

Map information display

Review how information is presented on top of the map.

Current issue:
Information can become difficult to read or overlap.

Improve:

attack markers
source/destination information
severity indicators
event counters
tooltips
detail panels

Example:

🇨🇳 China

Source:
185.xxx.xxx.xxx

Target:
web.example.com

Attack:
SQL Injection

Severity:
HIGH

Blocked:
YES

SOC dashboard behavior

The map should feel like an enterprise security operations center component.

Requirements:

clean visual hierarchy
consistent ARGUS typography
same cards/components used across dashboard
no unexpected animations
smooth real-time updates only

Animations should only represent security events, not layout movement.

Responsive behavior

Desktop:

Large fixed map visualization
Side information panels/cards

Tablet/mobile:

Responsive resizing
No horizontal scrolling
Information moves below the map when required

Technical review

Check:

CSS positioning
container height calculations
sticky/fixed elements
map library configuration
resize observers
scroll event handlers

Avoid:

uncontrolled transforms
dynamic height changes during scroll
layout shifts

Goal

The ARGUS dashboard Global Attack Map should behave like a professional SOC visualization:

stable
readable
predictable
visually consistent

The operator should be able to monitor attacks without the interface itself becoming distracting.

Labels:

component:dashboard
component:global-map
type:enhancement
priority:high

## Problem The Global Attack Map on /dashboard does not behave correctly during page scrolling. Current issues: - The map moves in an unexpected way when scrolling. - The position is not stable. - The visualization feels disconnected from the dashboard layout. - Information overlays are not optimally positioned. - The map does not provide a clean SOC operator experience. ## Expected behavior The Global Attack Map should behave as a fixed dashboard component. Requirements: - The map container must remain stable while scrolling. - The map must not move, jump or resize unexpectedly. - The viewport and map boundaries should remain consistent. - The layout must be responsive for different screen sizes. The operator should always understand: - where attacks originate - where they are targeting - attack severity - live event activity without the map interfering with page navigation. --- ## Layout improvements Redesign the dashboard layout so the Global Map has a dedicated area. Example: +--------------------------------------+ | | | GLOBAL ATTACK MAP | | | | Live attacks Threat level | | | +--------------------------------------+ +--------------------------------------+ | Security Metrics | +--------------------------------------+ The map should not overlap other dashboard elements. --- ## Map information display Review how information is presented on top of the map. Current issue: Information can become difficult to read or overlap. Improve: - attack markers - source/destination information - severity indicators - event counters - tooltips - detail panels Example: 🇨🇳 China Source: 185.xxx.xxx.xxx Target: web.example.com Attack: SQL Injection Severity: HIGH Blocked: YES --- ## SOC dashboard behavior The map should feel like an enterprise security operations center component. Requirements: - clean visual hierarchy - consistent ARGUS typography - same cards/components used across dashboard - no unexpected animations - smooth real-time updates only Animations should only represent security events, not layout movement. --- ## Responsive behavior Desktop: - Large fixed map visualization - Side information panels/cards Tablet/mobile: - Responsive resizing - No horizontal scrolling - Information moves below the map when required --- ## Technical review Check: - CSS positioning - container height calculations - sticky/fixed elements - map library configuration - resize observers - scroll event handlers Avoid: - uncontrolled transforms - dynamic height changes during scroll - layout shifts --- ## Goal The ARGUS dashboard Global Attack Map should behave like a professional SOC visualization: - stable - readable - predictable - visually consistent The operator should be able to monitor attacks without the interface itself becoming distracting. Labels: component:dashboard component:global-map type:enhancement priority:high

tech commented

2026-07-25 19:38:03 +00:00

Moved to the correct repository: weboria/argus-appliance#7. argus-installer only tracks customer installer/deployment issues; this is a product feature, so tracking continues there (a private repo). Closing here.

tech closed this issue

2026-07-25 19:38:03 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: Weboria/argus-installer#6