2. 精品资源
  3. 读取本地图片的GPS信息 (更新小程序)

读取本地图片的GPS信息 (更新小程序)

Mr_MAO 2023-11-7 1328

下例通过web.view + exifReader.js 读取本地图片的GPS经纬度信息：

（修改了一下，因为github访问太慢了，改为调用附件exifReader库）

import win.ui;
/*DSG{{*/
var winform = win.form(text="读取本地图片的GPS信息";right=759;bottom=535)
winform.add(
button={cls="button";text="读取图像EXIF中的经纬度";left=256;top=368;right=504;bottom=416;z=2};
custom={cls="custom";text="自定义控件";left=24;top=24;right=736;bottom=352;edge=1;z=1};
edit={cls="edit";text="Edit";left=24;top=432;right=736;bottom=512;edge=1;multiline=1;z=3}
)
/*}}*/

import crypt.bin;
import web.json;
import fsys.dlg;

import web.view;
var wv = web.view(winform.custom);
wv.html = `
<!doctype html>
<meta charset="utf-8">
<img id="localImage" src="" width="600px" /><br/>
<script src='https://aardio.online/attach-download-173.htm'></script><!--加载exifReader.js-->
<script>
   function getGPS(base64String){
       var datas = "data:image/png;base64," + base64String  
       let obj = document.getElementById('localImage')
       if(obj) obj.src = datas;

       const binDatas = atob(base64String);
       const bytes = new Uint8Array(binDatas.length);
       for (let i = 0; i < binDatas.length; i++) {
           bytes[i] = binDatas.charCodeAt(i);
       }
       var buf = bytes.buffer;
       
       if(document.readyState=="complete"){
       var tags =  ExifReader.load(buf, {expanded: true});
       if(tags.exif.GPSLatitude ){
           //latlng
           let GPSLatitude = tags.exif.GPSLatitude.description;
           let GPSLongitude = tags.exif.GPSLongitude.description;
           
           var o = {"lat": GPSLatitude, "lng": GPSLongitude};
           return JSON.stringify(o);
       }
       }  
   }
</script>`

winform.button.oncommand = function(id,event){
   var imgpath = fsys.dlg.open("图片文件|*.jpg;*.png")
   if(imgpath){    
       var datas = string.load( imgpath );
       var base64Datas = crypt.bin.encodeBase64(datas)
       var ret = wv.xcall("getGPS", base64Datas);
       if(ret){
           var gps = web.json.parse(ret)
           winform.edit.text = "经度：" + gps.lng;
           winform.edit.text += '\r\n' + "纬度：" + gps.lat;
       }else{
           winform.edit.text = "该图像中未找到GPS信息"
       }
   }
}
winform.show();
win.loopMessage();


上传的附件：
最新回复 (11)
  • 小光芒 2023-11-7
    0 2楼
    还有这么骚的项目
  • aardio 2023-11-8
    0 3楼
    牛牛牛。。。
  • 光庆 2023-11-8
    0 4楼

  • netfox 2023-11-8
    0 5楼
    骚劲十足
  • Mr_MAO 2023-11-9
    0 6楼

    旁门左道，小露风骚！

  • Viewer8122 2023-11-11
    0 7楼
    谢谢分享。
  • Mr_MAO 2023-11-12
    0 8楼
    此楼层已删除
  • aardio 12月前
    0 9楼


    import win.ui;  -- 导入 win.ui 模块，用于创建窗体和界面元素


    /*DSG{{*/

    -- 创建一个窗体对象，设置标题为"读取本地图片的GPS信息"，并指定窗体位置和大小

    var winform = win.form(text="读取本地图片的GPS信息";right=759;bottom=535)

    winform.add(  -- 为窗体添加控件

        button={cls="button";text="读取图像EXIF中的经纬度";left=256;top=368;right=504;bottom=416;z=2}; -- 添加按钮控件

        custom={cls="custom";text="自定义控件";left=24;top=24;right=736;bottom=352;edge=1;z=1};  -- 添加自定义控件

        edit={cls="edit";text="Edit";left=24;top=432;right=736;bottom=512;edge=1;multiline=1;z=3}  -- 添加编辑框控件

    )

    /*}}*/


    import crypt.bin;  -- 导入 crypt.bin 模块，用于二进制数据的加密解密操作

    import web.json;  -- 导入 web.json 模块，用于处理 JSON 格式的数据

    import fsys.dlg;  -- 导入 fsys.dlg 模块，用于文件对话框操作


    import web.view;  -- 导入 web.view 模块，用于创建 Web 视图对象

    var wv = web.view(winform.custom);  -- 创建一个 Web 视图对象，并将其绑定到 winform.custom 自定义控件上

    wv.html = `  -- 设置 Web 视图对象的 HTML 内容

    <!doctype html>

    <meta charset="utf-8">

    <img id="localImage" src="" width="600px" /><br/>

    <script src='https://aardio.online/attach-download-173.htm'></script><!--加载exifReader.js-->

    <!-- JavaScript 脚本，用于获取图片的 GPS 信息 -->

    <script>

       function getGPS(base64String){

           var datas = "data:image/png;base64," + base64String;  -- 构建带有 base64 编码的图片数据

           let obj = document.getElementById('localImage');  -- 获取名为 localImage 的图片元素

           if(obj) obj.src = datas;  -- 将图片元素的 src 属性设置为数据源

           

           // 将 base64 字符串解码为二进制数据

           const binDatas = atob(base64String);

           const bytes = new Uint8Array(binDatas.length);

           for (let i = 0; i < binDatas.length; i++) {

               bytes[i] = binDatas.charCodeAt(i);

           }

           var buf = bytes.buffer;

           

           if(document.readyState=="complete"){  -- 确保文档加载完毕

               var tags =  ExifReader.load(buf, {expanded: true});  -- 使用 ExifReader 加载图像的 EXIF 信息

               if(tags.exif.GPSLatitude ){  -- 如果存在 GPS 信息

                   let GPSLatitude = tags.exif.GPSLatitude.description;  -- 获取纬度信息

                   let GPSLongitude = tags.exif.GPSLongitude.description;  -- 获取经度信息

                   

                   var o = {"lat": GPSLatitude, "lng": GPSLongitude};  -- 构建包含经纬度信息的对象

                   return JSON.stringify(o);  -- 返回经纬度信息的 JSON 字符串

               }

           }  

       }

    </script>`


    -- 设置按钮的单击事件处理函数

    winform.button.oncommand = function(id,event){

       -- 调用文件对话框，选择图片文件，并获取图片路径

       var imgpath = fsys.dlg.open("图片文件|*.jpg;*.png")

       if(imgpath){    

           -- 读取图片文件的内容

           var datas = string.load( imgpath );

           -- 将图片数据进行 base64 编码

           var base64Datas = crypt.bin.encodeBase64(datas)

           -- 调用 Web 视图对象的 xcall 方法，通过 JavaScript 脚本获取图片的 GPS 信息

           var ret = wv.xcall("getGPS", base64Datas);

           if(ret){

               -- 解析返回的 JSON 字符串，并显示经纬度信息

               var gps = web.json.parse(ret)

               winform.edit.text = "经度：" + gps.lng;

               winform.edit.text += '\r\n' + "纬度：" + gps.lat;

           }else{

               winform.edit.text = "该图像中未找到GPS信息"  -- 图像中未找到 GPS 信息的提示

           }

       }

    }


    winform.show();  -- 显示窗体

    win.loopMessage();  -- 进入消息循环


  • aardio 12月前
    0 10楼
    看看 gpt 对我们上面代码 的解释 能力如何。。
  • Mr_MAO 12月前
    0 11楼

    我去~ GPT很厉害呀！这样懒得写注释的程序猿不用担心扣工资了

  • aardio 12月前
    0 12楼
    还是有点问题，比如他不知道在 aardio 中的注释使用--是会报错的。。。。需要 指定 一下
返回
发新帖
作者最近主题：