打印山脉算法

Printing mountain ranges algorithm

  /\
 /  \
/    \



 /\/\
/    \ 

   /\  
/\/  \

 /\
/  \/\


/\/\/\

对于 n=3 对起伏,我有 5 种可能的方法来绘制这些山脉。(我永远不应该低于 x=0 轴)。我有以下长 javascript 代码,当我在 browser.However 的控制台中打印这些输出时,当我尝试将它们输出为 html 时,它们工作正常,起伏未正确对齐。这是我的代码:

<html>


<script>
F=n=> {
m = n+n
outer:
   for (i=1; i < 1<<m; i+=2)
  {
       o=[]
       l=0;
       p=1;
   for (j = 1; j <1<<m; j+=j,p++)
 {

        if (i&j)
     {
        q=o[n-l]||[]
        q[p]=1;
        o[n-l]=q
        ++l;
     }
      else
       {
         --l;
          if (l<0) continue outer;
          q=o[n-l]||[]
          q[p]=0;
          o[n-l]=q
         }
      }
      if (l==0) 
  {

       console.log(o.join('\n').replace(/,\d?/g,r=>'\/'[r[1]]||' '));    // WORKS FINE IN CONSOLE AS SHOWN IN ABOVE.
       document.write(o.join('<br>').replace(/,\d?/g,r=>'\/'[r[1]]||' ')  ) // DOESNT PROPERLY SHOW THEM.

            }
        }
    }


    F(3);

    </script>

</html>

它像这样打印它们:

/\
/ \
/ \

/\/\
/ \

/\
/\/ \

/\
/ \/\


/\/\/\

有人知道我怎样才能正确输出它们吗?

您的问题是您将 ' ' space 用作乱码 space。 HTML 确实喜欢文字 space 一切都很好.. 最好使用 &nbsp; 作为

document.write(o.join('<br>').replace(/,\d?/g, r => '\/' [r[1]] || '&nbsp;'));

另外一件事,使用 fixed-width 字体和适当的 line-height 以获得更好的效果。

JSFiddle Example