Background:
- With many nodes, D3 force simulation tick callback updates all nodes/edges/labels every frame
- Original implementation called simulation.restart() in drag start event on mousedown
- Even after simulation converged, clicking a node to view details would restart simulation, causing lag
Solution:
- Distinguish between "click" and "drag" using 3px movement threshold
- On drag start: only record initial position, do not restart simulation
- On drag event: detect movement exceeding threshold before marking as actual drag and restarting simulation
- Pure click operations no longer trigger simulation restart, keeping graph static
Bug fix:
- Fixed issue where nodes became undraggable after initial optimization
- Cause: incorrectly used if(!event.active) check in drag event
- event.active equals 1 during drag event, causing restart() to never execute
- Removed that condition, using custom _isDragging flag to control logic instead
- Changed the title for the environment configuration status icon to "环境搭建" for clarity.
- Added a creation time display in the project detail modal for better context.
- Introduced a divider for the playback section to improve visual separation.
- Enhanced navigation buttons with step indicators for clearer user progression.
- Added a hint for playback limitations to inform users about simulation requirements.
- Updated CSS styles for new elements and improved overall modal aesthetics.
- Changed Python version specification to indicate compatibility with versions ≥3.11 and ≤3.12.
- Renamed "Contact Us" section to "Join the Conversation" for improved engagement.
- Added a centered image of the QQ group to the contact section for better visibility.
- Updated card header to include status icons indicating project availability for different functionalities.
- Added a visual indicator for additional files when more than three are present.
- Improved card footer layout by grouping date and time, and enhancing progress display with status colors.
- Introduced new CSS styles for status icons and improved overall card aesthetics.
- Wrapped modal content in a Transition component for smoother animations.
- Adjusted modal dimensions and padding for improved layout and user experience.
- Updated styles for modal elements, including background colors, borders, and hover effects.
- Enhanced visual feedback for buttons and file items within the modal.