Spaces:

nicoaspra
/

G-code_Programming_Assistant

Running

G-code_Programming_Assistant / gcode_viewer.html

nicoaspra

change footer and NC viewer commented out

c256b8e over 1 year ago

3.28 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>G-code Viewer</title>
	<style>
	body {
	margin: 0;
	overflow: hidden;
	}
	canvas {
	display: block;
	}
	</style>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/110/three.min.js"></script>
	</head>
	<body>
	<script>
	// Set up the scene, camera, and renderer
	const scene = new THREE.Scene();
	const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
	const renderer = new THREE.WebGLRenderer();
	renderer.setSize(window.innerWidth, window.innerHeight);
	document.body.appendChild(renderer.domElement);

	// Add a simple grid for reference
	const gridHelper = new THREE.GridHelper(200, 50);
	scene.add(gridHelper);

	// Load and parse G-code
	function loadGCode(gcode) {
	const material = new THREE.LineBasicMaterial({ color: 0x00ff00 });
	const points = [];
	const lines = gcode.split("\n");

	let currentX = 0, currentY = 0, currentZ = 0;
	let isRelative = false; // Tracks whether positioning is G90 (absolute) or G91 (relative)

	lines.forEach((line) => {
	line = line.trim();
	if (line.startsWith("G90")) {
	isRelative = false; // Absolute positioning
	} else if (line.startsWith("G91")) {
	isRelative = true; // Incremental positioning
	}

	const matchX = line.match(/X([-+]?\d*\.?\d+)/);
	const matchY = line.match(/Y([-+]?\d*\.?\d+)/);
	const matchZ = line.match(/Z([-+]?\d*\.?\d+)/);

	let newX = currentX;
	let newY = currentY;
	let newZ = currentZ;

	if (matchX) {
	const deltaX = parseFloat(matchX[1]);
	newX = isRelative ? currentX + deltaX : deltaX;
	}
	if (matchY) {
	const deltaY = parseFloat(matchY[1]);
	newY = isRelative ? currentY + deltaY : deltaY;
	}
	if (matchZ) {
	const deltaZ = parseFloat(matchZ[1]);
	newZ = isRelative ? currentZ + deltaZ : deltaZ;
	}

	points.push(new THREE.Vector3(newX, newY, newZ));

	currentX = newX;
	currentY = newY;
	currentZ = newZ;
	});

	const geometry = new THREE.BufferGeometry().setFromPoints(points);
	const line = new THREE.Line(geometry, material);
	scene.add(line);
	}

	// Add camera controls
	camera.position.set(0, 50, 200);
	camera.lookAt(0, 0, 0);

	// Animation loop
	function animate() {
	requestAnimationFrame(animate);
	renderer.render(scene, camera);
	}
	animate();

	// Load G-code from global variable
	if (window.gcode) {
	loadGCode(window.gcode);
	} else {
	console.error("No G-code provided");
	}
	</script>
	</body>
	</html>