5678
This commit is contained in:
@@ -177,17 +177,28 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
const centralNode = systemGraphic.querySelector('.central-node');
|
||||
const otherNodes = systemGraphic.querySelectorAll('.node:not(.central-node)');
|
||||
|
||||
if (!centralNode || !systemGraphic) return;
|
||||
if (!centralNode || !systemGraphic || !connections) return;
|
||||
|
||||
// Get the computed transform scale of the system graphic
|
||||
const computedStyle = window.getComputedStyle(systemGraphic);
|
||||
const transform = computedStyle.transform;
|
||||
let scale = 1;
|
||||
if (transform && transform !== 'none') {
|
||||
const matrix = new DOMMatrix(transform);
|
||||
scale = matrix.a; // Get the X scale factor
|
||||
}
|
||||
|
||||
const graphicRect = systemGraphic.getBoundingClientRect();
|
||||
const centralRect = centralNode.getBoundingClientRect();
|
||||
|
||||
// Calculate center position relative to the graphic container
|
||||
const centerX = centralRect.left - graphicRect.left + centralRect.width / 2;
|
||||
const centerY = centralRect.top - graphicRect.top + centralRect.height / 2;
|
||||
// Calculate center position relative to the graphic container, accounting for scale
|
||||
const centerX = (centralRect.left - graphicRect.left + centralRect.width / 2) / scale;
|
||||
const centerY = (centralRect.top - graphicRect.top + centralRect.height / 2) / scale;
|
||||
|
||||
// Set SVG viewBox to match container
|
||||
connections.setAttribute('viewBox', `0 0 ${graphicRect.width} ${graphicRect.height}`);
|
||||
// Set SVG viewBox to match container (unscaled dimensions)
|
||||
const viewBoxWidth = graphicRect.width / scale;
|
||||
const viewBoxHeight = graphicRect.height / scale;
|
||||
connections.setAttribute('viewBox', `0 0 ${viewBoxWidth} ${viewBoxHeight}`);
|
||||
connections.style.width = '100%';
|
||||
connections.style.height = '100%';
|
||||
|
||||
@@ -196,9 +207,9 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
otherNodes.forEach(node => {
|
||||
const nodeRect = node.getBoundingClientRect();
|
||||
|
||||
// Calculate node center position relative to the graphic container
|
||||
const nodeX = nodeRect.left - graphicRect.left + nodeRect.width / 2;
|
||||
const nodeY = nodeRect.top - graphicRect.top + nodeRect.height / 2;
|
||||
// Calculate node center position relative to the graphic container, accounting for scale
|
||||
const nodeX = (nodeRect.left - graphicRect.left + nodeRect.width / 2) / scale;
|
||||
const nodeY = (nodeRect.top - graphicRect.top + nodeRect.height / 2) / scale;
|
||||
|
||||
// Create dashed line for better visibility
|
||||
const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
|
||||
|
||||
Reference in New Issue
Block a user