首页 > 解决方案 > 带有javascript的可缩放菱形图案

问题描述

对javascript非常陌生,几周。我的目标是创造一个可缩放的钻石。

这是我到目前为止的代码。

var board = '';
var dimondX = 4;
var dimondY = 4;
  for (y = 0; y <= dimondY; y++) {
    for(x = 0; x <= dimondX; x++) {
        if ((y == 0 || y == dimondY ) && (x == dimondX / 2 )){ 
        board += "#" }  
        else if (( y == 1 || y == 3) && (x == 3 || x ==1 )) {
        board += "#" }
        else if (( y == dimondY / 2) && (x % 2 == 0)) {
        board += "#" }
        else { 
        board += " " }
    }  
  board += "\n" 
  };
console.log(board);

使用上面的代码,菱形的开始、结束和中间可以在任何尺寸下正常工作。但我不知道如何缩放中间行、开始或结束之间的行以及确切的中间行。Y触发器可以奇偶交替,我认为这会起作用。但是 X 触发器需要在更高的维度上分支,以至于我不知道如何表达它。

这是另一个钻石:

var board = "";
var dimondX = 8;
var dimondY = 8;
for (y = 0; y <= dimondY; y++) {
for(x = 0; x <= dimondX; x++) {
        if ((y == 0 || y == dimondY ) && (x == dimondX / 2 )){ 
        board += "#" }
        else if (( y == 1 || y == 7 )  && (x == 3 || x == 5)) {
        board += "#" }
        else if (( y == 2 || y == 6) && ((x % 2 == 0) && x > 1 && x < 8 )) {
        board += "#" }
        else if (( y == 3 || y == 5) && (x % 2 !== 0)) {
        board += "#" }
        else if (( y == dimondY / 2) && (x % 2 == 0)) {
        board += "#" }
        else { 
        board += " " }
}  
board += "\n" 
};
console.log(board);

可以看出。开始端和直接中间行不需要做任何事情,但中间的一切都需要手动调整。第一行之后 X 轴的公式是,x == (1 - (dimondX / 2) || (x == (1 + (dimondX / 2))。然后从那里每个点都有一个 + 1, -1. 我只是不知道如何表达。

不是真的在寻找一个直接的答案,而是一个提示,甚至是“这不是一个可行的方向”。

标签: javascript

解决方案


谢谢你的问题,我喜欢谜题,我真的很喜欢这个。这是我的版本,我做了一个通用的版本,长度是动态的你可以放任何数字

var board = '';
var N = 10;
var M = N/2;

for (y = 0; y <= N; y++) {
    for(x = 0; x <= N; x++) {

        c = Math.abs(M * -Math.floor(y/M) + y % M);
        if(c==N) c = 0;

        if(  (x >= M-c && x <= M+c) && (x % 2 == y%2) )
            board += "#";
        else
            board += " ";
    }
    board += "\n"; 
}
console.log(board);

推荐阅读