utm 转经纬度坐标 cesium Ue4 CityEngine

utm 转经纬度坐标|


html>
<html lang="en">
 
<head>
    <title>UTM to LatLng Conversiontitle>
    <meta charset="utf-8" />
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            background-color: #f5f5f5;
        }
 
        h1 {
            font-size: 24px;
            margin-bottom: 20px;
            text-align: center;
        }
 
        form {
            max-width: 400px;
            margin: 0 auto;
            background-color: #ffffff;
            padding: 20px;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }
 
        p {
            font-size: 18px;
            margin-bottom: 10px;
        }
 
        label {
            display: inline-block;
            width: 120px;
            font-weight: bold;
        }
 
        input[type="number"] {
            width: 100%;
            padding: 10px;
            font-size: 16px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
 
        button {
            display: block;
            width: 100%;
            padding: 10px;
            font-size: 16px;
            font-weight: bold;
            color: #fff;
            background-color: #007bff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
 
        #result {
            font-weight: bold;
            font-size: 20px;
            margin-top: 20px;
            text-align: center;
        }
 
        #saveButton {
            margin-top: 20px;
            background-color: #28a745;
        }
    style>
    style>
    <script src="https://cdn.bootcdn.net/ajax/libs/proj4js/2.9.0/proj4-src.js">script>
head>
 
<body>
    <h1>UTM to LatLng Conversionh1>
    <form>
        <p>
            <label for="utmX">UTM X-coordinate:label>
            <input type="number" id="utmX" step="any" />
        p>
        <p>
            <label for="utmY">UTM Y-coordinate:label>
            <input type="number" id="utmY" step="any" />
        p>
        <button type="button" onclick="convertUTMToLatLng()">Convertbutton>
    form>
 
    <p>Converted LatLng:p>
    <p id="result">p>
 
    <button id="saveButton" type="button" onclick="saveToLocalStorage()">Save Coordinatesbutton>
 
    <script>
        const utmProjection = '+proj=utm +zone=49 +datum=WGS84 +units=m +no_defs';
 
        const utmXInput = document.getElementById('utmX');
        const utmYInput = document.getElementById('utmY');
        const resultElement = document.getElementById('result');
 
        // Load coordinates from local storage if available
        window.onload = function () {
            if (localStorage.getItem('utmX') && localStorage.getItem('utmY')) {
                utmXInput.value = localStorage.getItem('utmX');
                utmYInput.value = localStorage.getItem('utmY');
            }
        }
        let latLngRes = ''
        const convertUTMToLatLng = () => {
            const utmX = parseFloat(utmXInput.value);
            const utmY = parseFloat(utmYInput.value);
 
            if (isNaN(utmX) || isNaN(utmY)) {
                alert('Please enter valid UTM coordinates.');
                return;
            }
 
            // Define UTM projection object
            const utm = proj4(utmProjection);
 
            // Perform projection conversion
            const latLng = utm.inverse([utmX, utmY]);
            console.log(latLng,'latLng');
            latLngRes = `${latLng[0]}, ${latLng[1]}`
            // Update the displayed result
            resultElement.textContent = `${latLng[0]}, ${latLng[1]}`;
 
            // Save coordinates to local storage
            localStorage.setItem('utmX', utmX);
            localStorage.setItem('utmY', utmY);
        };
        const saveToLocalStorage = () => {
            const utmX = parseFloat(utmXInput.value);
            const utmY = parseFloat(utmYInput.value);
 
            if (isNaN(utmX) || isNaN(utmY)) {
                alert('Please enter valid UTM coordinates.');
                return;
            }
 
            // Save coordinates to local storage
            localStorage.setItem('utmX', utmX);
            localStorage.setItem('utmY', utmY);
            // 创建一个辅助元素用于复制文本
            var tempElement = document.createElement("textarea");
            tempElement.value = latLngRes;
            document.body.appendChild(tempElement);
 
            // 选择辅助元素的文本并复制
            tempElement.select();
            document.execCommand("copy");
 
            // 移除辅助元素
            document.body.removeChild(tempElement);
            alert("Text copied!");
        };
    script>

相关阅读:
font-spider 压缩字体使用
 数字安全设备制造有哪几种方式？
恒运资本：股市板块轮动顺口溜？
大规模ddos攻击事件,ddos攻击会暴露ip吗
 二叉树的存储结构
 商超仓库管理系统
 Ⅰ. C++基本使用
 Mpeg-Niacin 甲氧基-聚乙二醇-烟酸，Mpeg-NOTA甲氧基聚乙二醇-NOTA
HTML的段落中怎么样显示出标签要使用的尖括号＜＞?
图论09-桥和割点
原文地址：https://blog.csdn.net/songJunFeng1/article/details/133992037

utm 转 经纬度坐标 cesium Ue4 CityEngine

utm 转经纬度坐标 cesium Ue4 CityEngine