算法:如何打印大字体的字母

时间:2017-11-26 07:46:28

标签: javascript arrays algorithm for-loop pacman

例如,当输入为" y"时,它将打印: the output looks like this. 我使用前端语言来显示示例。我只是将嵌套数组生成为9 * 9网格来模拟输出。然后使用for循环将它们更改为HTML语法。在这种情况下,无论我使用什么语言,关键是算法。我不认为我的算法是有效的,因为我必须为26个字母生成26个嵌套数组。有没有有效的方法来解决这个问题,而不是创建26个嵌套数组?



$(document).ready(function(){
    

    var letter_y=[
        [0,0,0,0,0,0,0,0,0],
        [0,1,0,0,0,0,0,1,0],
        [0,1,0,0,0,0,0,1,0],
        [0,1,0,0,0,0,0,1,0],
        [0,1,1,1,1,1,1,1,0],
        [0,0,0,0,1,0,0,0,0],
        [0,0,0,0,1,0,0,0,0],
        [0,0,0,0,1,0,0,0,0],
        [0,0,0,0,1,0,0,0,0],
        [0,0,0,0,0,0,0,0,0],
    ]




    for(var x=0;x<letter_y.length;x++){
        for(var j=0;j<letter_y[x].length;j++){
            if(letter_y[x][j]===0)
            $('.row').append('<div class="grid"></div>');
            if(letter_y[x][j]===1)
            $('.row').append('<div class="grid2"></div>');
        }     
        $('.row').append('<br>');
    }

    
});
&#13;
.grid{
    background-color: black;
    width: 20px;
    height: 20px;
    display: inline-block;
    margin:0px;
}
.row{
    line-height: 0px;
}
.grid2{
    background-color: blue;
    width: 20px;
    height: 20px;
    display: inline-block;
}
&#13;
<!DOCTYPE html>
<html lang="en">
   <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">  
        <title>fill_me_in</title>
        <meta name="description" content="fill_me_in" >
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css " rel="stylesheet">            
        <link rel="stylesheet" type="text/css" href="style.css">
        
   </head>
   <body>
        <nav id="nav_top" class="navbar navbar-inverse navbar-static-top">
                <div class="container" id="main_container">
                        <a class="navbar-brand" href="http://api.jquery.com">Pac_man</a>
                </div>
        </nav>
        <div class="container">
                <div class="row">
                    
                    
                </div>
            </div>
        
        <div class="own"></div>





            <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
            <script src="application.js"></script> 
           
        
   </body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:2)

表示符号有两种常用方法 - 栅格表示和矢量表示。由于您已经尝试将符号图像存储为位图,因此您可以尝试向量 - 例如“1”可以是“行(0,0)到(0,10)”。

如果主要关注的是大小/位图在代码中的外观,您可以使用字符串("010000010",...)或单个数字位(这样9x9可以用9个数字表示)。

注意:如果您的目标只是渲染巨大的像素化字母 - 可能会有匹配的字体。此外,您可能需要弄清楚如何在客户端上提供此类字体。