js+html空间数据编码问题--以姓名为例（代码设涉及文件读取，文本数字提取，特别是文本x,y坐标的提取）

最新推荐文章于 2021-08-30 10:47:47 发布

悬挂点

最新推荐文章于 2021-08-30 10:47:47 发布

阅读量1.7k

点赞数 2

分类专栏： javascript 文章标签： javascript html5

本文链接：https://blog.csdn.net/zhoujiaaw/article/details/78327142

版权

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

格式问题

• ESRI ArcInfo Generate文件格式

• 点数据格式 <ID>, <X,Y> , {Angle},{Scale} END

• 线数据格式 <ID> <X,Y>

END

以某一个字为例：

L1
8,6.5
8.5,7
9,8 
end        
L2          
10.5,6.5
9.5,8.5
end
L3          
7.5,8.5
9.5,8.5
11.5,8.5
end
L4          
7,10.5
9.5,10.5
11.5,10.5
end
L5          
9.5,8.5
9.5,10.5
9.5,11.5
9,12.5
7.5,14
end
L6          
9.5,11.5
10.5,12.5
11.5,13.5
end
L7
12.5,7
12.5,14.5
end
L8          
12.5,7
15,7
13,10
14.5,11
15,12
14.5,12.5
14,13 
13,12.5
end

代码描述：

要求：

1、绘制16x16网格，并在其上书写实习人的姓名，字体采用等线体

2、依据网格对网格中的汉字笔画进行几何特征的编码

3、按照ArcInfo的Gen格式形成编码文件（上图）

4、编写程序读取Gen格式文件，并将结果绘制在屏幕上

结果：

源码：

<html>  
    <head>  
        <title>名称编码</title>  
    </head>  
        <body>             
            <input id="fileInput" type="file" οnchange="processFiles()"/>
            <br>
            <canvas id="myCanvas" width="1000" height="600" style="border:1px solid #c3c3c3">your browser does not support the canvas tag </canvas>
            
            <script>  
                function processFiles(){
                    var file=document.getElementById("fileInput").files[0];
                    var reader=new FileReader();
                    reader.readAsText(file);
                    reader.οnlοad=function(e)
                    {
                        var str = this.result;//读取文本
                        var number = new Array();
                        number= digitalExtraction(str,number);//提取数字并存入数组
                        draw(number);//画图
                    }
                    
                }
                //提取数字，并存入数组
               function digitalExtraction(str,number){
                    var heap= str.replace(/[^0-9.L]/ig,"A");

                    var numcharacter="";//存储数字字符
                    var number =new Array();//提取数字数组
                    var i=0;
                    var flag=0;//heap字符串当前标记
                    var n=0;//标识数字与字符转换位置
                    var character=heap[flag];//获取字符串的一个字符
                   // document.write(heap);
                    while(character!=null){
                        if(character=="L"){
                             number[i++]=-1;
                             flag+=2;
                             character=heap[flag];
                         }
                        if(character!="A"){
                            n=1;
                            numcharacter+=character;
                          }
                        else{
                            if(n){
                                number[i++]=parseFloat(numcharacter);
                                numcharacter="";
                                n=0;
                            }
                        }
                         character=heap[++flag];
                    }
                   
                    return number;
               }
               function draw(number){
                    var canvas=document.getElementById('myCanvas');
                    
                    var cxt=canvas.getContext('2d'); 
                    var n= number.length;
                    number[n]=-1;
                    var n= number.length;

                   var flag=0;
                   var x= new Array();
                   var y =new Array();
                   var j=0;
                    for(var i=1,j=0;i<n;i++){
                        if(number[i]!=-1){
                            x[j]=number[i]*10;
                            y[j]=number[++i]*10;
                            j++;
                        }else{
                            cxt.moveTo(x[0],y[0]);
                            for(var k=1;k<j;k++){
                                cxt.lineTo(x[k],y[k]);
                            }
                            cxt.stroke();
                            j=0;
                        }
                    }
                    

               }
            
            </script>   
        </body>  
</html>

悬挂点

关注

2
点赞
踩
9

收藏

觉得还不错? 一键收藏
1
评论
js+html空间数据编码问题--以姓名为例（代码设涉及文件读取，文本数字提取，特别是文本x,y坐标的提取）

格式问题• ESRI ArcInfo Generate文件格式 • 点数据格式 , , {Angle},{Scale} END • 线数据格式 END END以某一个字为例：L18,6.58.5,79,8 end L2 10.5,6.59.5,8.5endL3
复制链接

扫一扫