Вот полная функция `drawWellStructure`: ```javascript function drawWellStructure(data, scale = 40) { const graphicsScrollContainer = document.getElementById('graphicsScrollContainer'); if (!graphicsScrollContainer) return; graphicsScrollContainer.innerHTML = ''; const activeDocType = data.documentationType || 'primary'; const mergedGeology = createMergedGeologyFromDocumentation(activeDocType); const assays = xmlData?.assays || []; const totalDepth = data.totalDepth; const totalHeight = totalDepth * scale; const headerHeight = 45; // Ширина колонки const columnWidth = 100; const drillWidth = 85; const assaysWidth = 150; // Контейнер const columnContainer = document.createElement('div'); columnContainer.style.cssText = ` position: relative; width: 100%; min-width: 550px; background: white; border: 1px solid #cbd5e1; border-radius: 4px; overflow: hidden; `; // ШАПКА const header = document.createElement('div'); header.style.cssText = ` position: sticky; top: 0; z-index: 100; display: flex; height: ${headerHeight}px; background: #e2e8f0; border-bottom: 1px solid #94a3b8; flex-shrink: 0; `; const depthHeader = document.createElement('div'); depthHeader.style.cssText = ` width: 60px; min-width: 60px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.7rem; color: #0f172a; border-right: 1px solid #cbd5e1; background: #e2e8f0; `; depthHeader.textContent = 'глубина, м'; const coreHeader = document.createElement('div'); coreHeader.style.cssText = ` width: ${columnWidth}px; min-width: ${columnWidth}px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.7rem; color: #0f172a; border-right: 1px solid #cbd5e1; background: #e2e8f0; `; coreHeader.textContent = 'Колонка'; const drillHeader = document.createElement('div'); drillHeader.style.cssText = ` width: ${drillWidth}px; min-width: ${drillWidth}px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.7rem; color: #0f172a; border-right: 1px solid #cbd5e1; background: #e2e8f0; `; drillHeader.textContent = 'Кат. бур.'; const assaysHeader = document.createElement('div'); assaysHeader.style.cssText = ` width: ${assaysWidth}px; min-width: ${assaysWidth}px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.7rem; color: #0f172a; background: #e2e8f0; `; assaysHeader.textContent = 'Пробы'; header.appendChild(depthHeader); header.appendChild(coreHeader); header.appendChild(drillHeader); header.appendChild(assaysHeader); columnContainer.appendChild(header); // ТЕЛО const body = document.createElement('div'); body.style.cssText = ` display: flex; position: relative; min-height: ${totalHeight}px; overflow-y: auto; max-height: 65vh; `; // Область глубины const depthArea = document.createElement('div'); depthArea.style.cssText = `width: 60px; background: #f8fafc; border-right: 1px solid #cbd5e1; position: relative;`; const depthBody = document.createElement('div'); depthBody.style.cssText = `position: relative; height: ${totalHeight}px;`; depthArea.appendChild(depthBody); // Область колонки const coreArea = document.createElement('div'); coreArea.style.cssText = `width: ${columnWidth}px; background: #ffffff; border-right: 1px solid #cbd5e1; position: relative;`; const coreBody = document.createElement('div'); coreBody.style.cssText = `position: relative; height: ${totalHeight}px;`; coreArea.appendChild(coreBody); // Область категорий бурения const drillArea = document.createElement('div'); drillArea.style.cssText = `width: ${drillWidth}px; background: #f8fafc; border-right: 1px solid #cbd5e1; position: relative;`; const drillBody = document.createElement('div'); drillBody.style.cssText = `position: relative; height: ${totalHeight}px;`; drillArea.appendChild(drillBody); // Область проб const assaysArea = document.createElement('div'); assaysArea.style.cssText = `width: ${assaysWidth}px; background: #ffffff; position: relative;`; const assaysBody = document.createElement('div'); assaysBody.style.cssText = `position: relative; height: ${totalHeight}px;`; assaysArea.appendChild(assaysBody); body.appendChild(depthArea); body.appendChild(coreArea); body.appendChild(drillArea); body.appendChild(assaysArea); columnContainer.appendChild(body); graphicsScrollContainer.appendChild(columnContainer); // === ШКАЛА ГЛУБИНЫ === for (let depth = 0; depth <= totalDepth; depth += 5) { const yPos = depth * scale; if (yPos >= 0 && yPos <= totalHeight) { const line = document.createElement('div'); line.style.cssText = `position: absolute; top: ${yPos}px; left: 8px; right: 0; height: 1px; background: #cbd5e1;`; const label = document.createElement('span'); label.style.cssText = `position: absolute; right: 6px; top: ${yPos}px; font-weight: 600; font-size: 0.65rem; color: #1e293b; background: #f8fafc; padding: 0 2px; transform: translateY(-50%);`; label.textContent = depth.toString(); depthBody.appendChild(line); depthBody.appendChild(label); } } // Метки через 1 метр for (let depth = 0; depth <= totalDepth; depth += 1) { if (depth % 5 !== 0) { const yPos = depth * scale; if (yPos >= 0 && yPos <= totalHeight) { const line = document.createElement('div'); line.style.cssText = `position: absolute; top: ${yPos}px; left: 8px; right: 0; height: 1px; background: #e2e8f0;`; depthBody.appendChild(line); } } } // Границы интервалов документирования mergedGeology.forEach((geo) => { const topY = geo.from * scale; const bottomY = geo.to * scale; if (topY >= 0 && topY <= totalHeight) { const label = document.createElement('div'); label.style.cssText = `position: absolute; right: 6px; top: ${topY}px; font-size: 0.6rem; color: #e74c3c; background: white; padding: 0 2px; transform: translateY(-50%); z-index: 5; font-weight: bold;`; label.textContent = geo.from.toFixed(1); depthBody.appendChild(label); } if (bottomY >= 0 && bottomY <= totalHeight) { const label = document.createElement('div'); label.style.cssText = `position: absolute; right: 6px; top: ${bottomY}px; font-size: 0.6rem; color: #e74c3c; background: white; padding: 0 2px; transform: translateY(-50%); z-index: 5; font-weight: bold;`; label.textContent = geo.to.toFixed(1); depthBody.appendChild(label); } }); // === ОТРИСОВКА ГЕОЛОГИЧЕСКИХ ИНТЕРВАЛОВ === const geologyBlocks = []; mergedGeology.forEach((geo, index) => { const topY = geo.from * scale; const heightY = (geo.to - geo.from) * scale; if (heightY > 0) { // Блок в колонке const block = document.createElement('div'); const bgColor = getStratigraphyBackground({ stratigraphy: geo.stratigraphy, originalStratigraphy: geo.originalStratigraphy }); const isDark = isColorDark(bgColor); block.style.cssText = ` position: absolute; top: ${topY}px; left: 0; width: 100%; height: ${heightY}px; background: ${bgColor}; border: 1px solid rgba(0,0,0,0.25); cursor: pointer; transition: all 0.15s ease; display: flex; align-items: center; justify-content: center; z-index: 1; `; // Возраст const ageSpan = document.createElement('span'); ageSpan.style.cssText = ` font-family: 'GeoindexA', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important; font-feature-settings: "ss01" on !important; font-variant-numeric: lining-nums !important; font-weight: 700; font-size: 0.7rem; color: ${isDark ? '#ffffff' : '#0f172a'}; background: rgba(255,255,255,0.7); padding: 2px 6px; border-radius: 2px; text-align: center; z-index: 2; letter-spacing: 0.5px; `; ageSpan.textContent = geo.originalStratigraphy || geo.stratigraphy || ''; block.appendChild(ageSpan); // Крап литологии if (geo.lcode && window.LITHOLOGY_PATTERNS && window.LITHOLOGY_PATTERNS[geo.lcode]) { const patternOverlay = document.createElement('div'); const patternSize = getPatternSize(scale); const fileName = window.LITHOLOGY_PATTERNS[geo.lcode]; const patternUrl = `litology/${fileName}`; patternOverlay.style.cssText = ` position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("${patternUrl}"); background-repeat: repeat; background-size: ${patternSize.width}px ${patternSize.height}px; opacity: 0.5; pointer-events: none; z-index: 1; `; block.appendChild(patternOverlay); } block.dataset.layerId = index; block.addEventListener('click', (e) => { e.stopPropagation(); highlightGeologyBlock(index); if (window.geologyCards && window.geologyCards[index]) { window.geologyCards[index].scrollIntoView({ behavior: 'smooth', block: 'center' }); window.geologyCards[index].click(); } }); coreBody.appendChild(block); geologyBlocks.push(block); // Категория бурения const drillCell = document.createElement('div'); drillCell.style.cssText = ` position: absolute; top: ${topY}px; left: 0; width: 100%; height: ${heightY}px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-bottom: 1px solid #e2e8f0; background: #f8fafc; font-size: 0.7rem; line-height: 1.4; text-align: center; cursor: pointer; `; let categoriesHtml = ''; if (geo.rockCategories && geo.rockCategories !== 'Не указано' && geo.rockCategories !== '') { const categories = geo.rockCategories.split('; '); categoriesHtml = categories.map(cat => { const match = cat.match(/([\d.-]+)-([\d.-]+)\s*-\s*(.+)/); if (match) { return `