From 32672387a6ac8d666db988d37c77add41c0a9eea Mon Sep 17 00:00:00 2001 From: Cyber Panel Date: Tue, 1 Jul 2025 12:07:20 +0200 Subject: [PATCH] fix: Update text descriptions in Cross and Home components for clarity --- components/templates/generator.js | 211 +++++++++++++++++++++++------- pages/cross.js | 2 +- pages/index.js | 6 +- 3 files changed, 170 insertions(+), 49 deletions(-) diff --git a/components/templates/generator.js b/components/templates/generator.js index 8f377c2..9f326c2 100644 --- a/components/templates/generator.js +++ b/components/templates/generator.js @@ -43,34 +43,49 @@ export default function Generator() { const getPath = (e, path) => { let newLines = []; + const lines = path.split("\n"); - for (let line of path.split("\n")) { - if (line[0] == "P") continue; - if (line[0] == "S") continue; - if (line[0] == "X") continue; + // Parse the data more accurately + for (let line of lines) { + line = line.trim(); + // Skip header lines, segment lines, and empty lines + if (line.startsWith("Próbkowanie") || + line.startsWith("Segment") || + line.startsWith("X:") || + line === "") { + continue; + } newLines.push(line); } - let xs = [], ys = [], zs = []; - let toti = 0, al = 0; - - for (let line of newLines) { - al += 1; - let theLine = line.split(","); - - if (xs && parseFloat(theLine[0]) == xs[-1] && parseFloat(theLine[1]) == ys[-1]) - continue; - - if (al > 2) { - let dist = ((xs[xs.length - 1] - xs[xs.length - 2]) ** 2 + - (ys[ys.length - 1] - ys[ys.length - 2]) ** 2) ** 0.5; - toti += Math.round(dist); - } - xs.push(parseFloat(theLine[0])); - ys.push(parseFloat(theLine[1])); - zs.push(parseFloat(theLine[2])); + if (newLines.length === 0) { + console.log("No valid coordinate data found"); + return; } + let points = []; + + // Parse coordinates more reliably + for (let line of newLines) { + const coords = line.split(/[,\t]+/).map(s => s.trim()); + if (coords.length >= 3) { + const x = parseFloat(coords[0]); + const y = parseFloat(coords[1]); + const z = parseFloat(coords[2]); + + if (!isNaN(x) && !isNaN(y) && !isNaN(z)) { + points.push({ x, y, z }); + } + } + } + + if (points.length === 0) { + console.log("No valid points parsed"); + return; + } + + console.log(`Parsed ${points.length} points`); + const canvas = document.getElementById("canvas"); console.log("Canvas element:", canvas); if (!canvas || !canvas.getContext) { @@ -81,32 +96,138 @@ export default function Generator() { } const ctx = canvas.getContext("2d"); - ctx.clearRect(0, 0, 700, 500); - ctx.strokeStyle = "#3B82F6"; - ctx.lineWidth = 2; + const canvasWidth = 800; // Match the canvas width + const canvasHeight = 400; // Match the canvas height + const padding = 50; - let scaleFactor = 100000 / 2000; - let totalH = Math.max(...zs); - let minH = Math.min(...zs); + // Clear canvas + ctx.clearRect(0, 0, canvasWidth, canvasHeight); - for (let line = 0; line < xs.length - 1; line++) { - let x1 = line * scaleFactor; - let y1 = zs[line]; - let x2 = (line + 1) * scaleFactor; - let y2 = zs[line + 1]; + // Calculate bounds + const xCoords = points.map(p => p.x); + const yCoords = points.map(p => p.y); + const zCoords = points.map(p => p.z); + + const minX = Math.min(...xCoords); + const maxX = Math.max(...xCoords); + const minY = Math.min(...yCoords); + const maxY = Math.max(...yCoords); + const minZ = Math.min(...zCoords); + const maxZ = Math.max(...zCoords); + + // Calculate distances along the path + let distances = [0]; + let totalDistance = 0; + + for (let i = 1; i < points.length; i++) { + const dx = points[i].x - points[i-1].x; + const dy = points[i].y - points[i-1].y; + const distance = Math.sqrt(dx * dx + dy * dy); + totalDistance += distance; + distances.push(totalDistance); + } + + console.log(`Total distance: ${totalDistance.toFixed(2)}m, Height range: ${minZ.toFixed(2)}m - ${maxZ.toFixed(2)}m`); + + // Set up drawing area + const drawWidth = canvasWidth - 2 * padding; + const drawHeight = canvasHeight - 2 * padding; + + // Draw coordinate system + ctx.strokeStyle = "#E5E7EB"; + ctx.lineWidth = 1; + + // Draw grid + const gridLines = 10; + for (let i = 0; i <= gridLines; i++) { + const x = padding + (i / gridLines) * drawWidth; + const y = padding + (i / gridLines) * drawHeight; - let b0 = 50, b1 = 450; - let z1 = b0 + (b1 - b0) * ((y1 - totalH) / (minH - totalH)); - let z2 = b0 + (b1 - b0) * ((y2 - totalH) / (minH - totalH)); - - let x12 = b0 + (b1 - b0) * ((x1 - 0) / (toti * scaleFactor)); - let x22 = b0 + (b1 - b0) * ((x2 - 0) / (toti * scaleFactor)); - + // Vertical grid lines ctx.beginPath(); - ctx.moveTo(x12, z1); - ctx.lineTo(x22, z2); + ctx.moveTo(x, padding); + ctx.lineTo(x, canvasHeight - padding); + ctx.stroke(); + + // Horizontal grid lines + ctx.beginPath(); + ctx.moveTo(padding, y); + ctx.lineTo(canvasWidth - padding, y); ctx.stroke(); } + + // Draw axes + ctx.strokeStyle = "#6B7280"; + ctx.lineWidth = 2; + + // X-axis (bottom) + ctx.beginPath(); + ctx.moveTo(padding, canvasHeight - padding); + ctx.lineTo(canvasWidth - padding, canvasHeight - padding); + ctx.stroke(); + + // Y-axis (left) + ctx.beginPath(); + ctx.moveTo(padding, padding); + ctx.lineTo(padding, canvasHeight - padding); + ctx.stroke(); + + // Draw labels + ctx.fillStyle = "#374151"; + ctx.font = "12px sans-serif"; + ctx.textAlign = "center"; + + // Distance labels (bottom) + for (let i = 0; i <= 5; i++) { + const distance = (totalDistance * i) / 5; + const x = padding + (i / 5) * drawWidth; + ctx.fillText(`${distance.toFixed(0)}m`, x, canvasHeight - padding + 20); + } + + // Height labels (left) + ctx.textAlign = "right"; + for (let i = 0; i <= 5; i++) { + const height = minZ + ((maxZ - minZ) * i) / 5; + const y = canvasHeight - padding - (i / 5) * drawHeight; + ctx.fillText(`${height.toFixed(1)}m`, padding - 10, y + 4); + } + + // Draw profile line + ctx.strokeStyle = "#3B82F6"; + ctx.lineWidth = 3; + ctx.lineCap = "round"; + ctx.lineJoin = "round"; + + ctx.beginPath(); + for (let i = 0; i < points.length; i++) { + const x = padding + (distances[i] / totalDistance) * drawWidth; + const y = canvasHeight - padding - ((points[i].z - minZ) / (maxZ - minZ)) * drawHeight; + + if (i === 0) { + ctx.moveTo(x, y); + } else { + ctx.lineTo(x, y); + } + } + ctx.stroke(); + + // Draw elevation points + ctx.fillStyle = "#3B82F6"; + for (let i = 0; i < points.length; i++) { + const x = padding + (distances[i] / totalDistance) * drawWidth; + const y = canvasHeight - padding - ((points[i].z - minZ) / (maxZ - minZ)) * drawHeight; + + ctx.beginPath(); + ctx.arc(x, y, 4, 0, 2 * Math.PI); + ctx.fill(); + } + + // Add title + ctx.fillStyle = "#1F2937"; + ctx.font = "16px sans-serif"; + ctx.textAlign = "center"; + ctx.fillText("Profil terenu", canvasWidth / 2, 30); + setPreviewVisible(true); }; @@ -265,9 +386,9 @@ export default function Generator() {
{!previewVisible && ( diff --git a/pages/cross.js b/pages/cross.js index bccb53e..dd928b7 100644 --- a/pages/cross.js +++ b/pages/cross.js @@ -77,7 +77,7 @@ export default function Cross() {

Generator siatki

-

Przekształć pliki DXF na siatki instalacyjne

+

Dodaj siatkę do mapy w pliku DXF

diff --git a/pages/index.js b/pages/index.js index 02ccdc7..83b25ec 100644 --- a/pages/index.js +++ b/pages/index.js @@ -20,7 +20,7 @@ export default function Home() { Generator profilu przekroju terenu

- Twórz profesjonalne profile terenowe na podstawie danych z Geoportalu lub wprowadzonych ręcznie + Stwórz profil terenu

@@ -54,7 +54,7 @@ export default function Home() { {/* Info Cards */} -
+ {/*
@@ -98,7 +98,7 @@ export default function Home() {
-
+
*/} );