JSで奇数を入力したら数に応じてダイヤモンドを作りたいのですが・・・。

こんにちは
タイトル通りの質問です
１と入力すれば
◇
３と入力すれば
◇
◇ ◇
◇
といった具合です。
コードを書いたのですがfor文のところがうまく動きません
どうすれば動きますか？

lang
1<!doctype html>
2<html>
3<head>
4  <meta charset="utf-8">
5</head>
6
7<body>
8  <script>
9  var num = prompt("奇数を入力してください");
10
11  var center = num / 2;
12  var diff = 0;
13
14  for (var i = 0; i < num; i++){
15    for (var j = 0; j < num; j++){
16      if(j == center - diff || j == center + diff){
17        document.write("◇");
18      }else{
19        document.write("□");
20      }
21    }
22    document.write("<br>");
23    if (i < center) {
24      diff++;
25    }else{
26      diff--;
27    }
28  }
29
30  </script>
31</body>
32
33</html>
34

行動規範の内容に同意します

回答5件

<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <script>
      var num = prompt("数を入力してください");
      if (num % 2 == 1 && num > 0) {
        var center = Math.floor(num / 2);
        for (var i = 0; i < center * 2 + 1; i++) {
          var line = "";
          var width = center - Math.abs(i - center);
          for (var j = 0; j < num; j++) {
            var ch = (j == center - width || j == center + width)?  '◇' : '□';
            line += ch;
          }
          document.write(line + "<br>")
        }
      }
    </script>
  </body>
</html>

width = center - Math.abs(i - center);
は、center からのズレを計算します。
0 行目のときは 0,
cener 行目までは +1 ずつふえていきます。
center 行からは -1 ずつへっていき num -1 行目では 0 になります。
メモリ上で一行文の文字列を構築するようにし、行単位で document.write するようにしました。

投稿2015/07/12 07:31

katoy

総合スコア22324

こんなかんじでどうでしょう。
数学的に素直に考えればきれいに書けると思います。

lang
1<!doctype html>
2<html>
3<head>
4	<meta charset="utf-8">
5</head>
6
7<body>
8	<script>
9	var num = prompt("奇数を入力してください");
10	var half = Math.floor(num / 2);
11	var n = half % 2;
12
13	for (var i = -half; i <= half; i++) {
14		for (var j = -half; j <= half; j++) {
15			var v = Math.abs(i) + Math.abs(j);
16			if (v <= half && v % 2 == n) {
17				document.write("◇");
18			} else {
19				document.write("□");
20			}
21		}
22		document.write("<br>");
23	}
24
25	</script>
26</body>
27
28</html>

投稿2015/07/12 05:52

miu_ras

総合スコア902

こんな感じでできるかと思います。

lang
1<script>
2 var num = prompt("奇数を入力してください");
3
4 var center = num/2;
5 var diff = 0;
6
7 for (var i = 0; i < num; i++){
8  
9     if (i < center) {
10         diff++;
11     }else{
12         diff--;
13     }
14  
15    for(var j = 0;  j < diff; j++){
16        document.write("□");
17     }
18    document.write("<br>");
19  
20}
21</script>

投稿2015/07/09 09:17

b.u.d.y

総合スコア17

lang
1var num = 3;
2if(num % 2 == 1){
3  奇数の処理
4}

でどうですか？

修正しまくって申し訳ない。。。
追記質問を読んでいませんでした。。。
まず、

lang
1  if(j == center - diff || j == center + diff){
2  }

がおかしいですね。
奇数を入力している時点でcenterが整数になることはないので==で比較しても条件に入ることは無いです。

作りたいイメージとしては
1の時：
◇

3の時：
◇
◇◇
◇

5の時：
◇
◇◇
◇◇◇
◇◇
◇

ですかね？

投稿2015/07/09 08:37

編集2015/07/09 09:03

JunTomizawa

総合スコア248

Yoshinori

2015/07/09 09:49

すみません＞＜しっかりかけてませんでした・・・。 3の場合だと □◇□ ◇□◇ □◇□ こういう感じです。

JunTomizawa

2015/07/09 10:07

あの、5の場合はどうなるんですかね？ 1と3だけですかね？

Yoshinori

2015/07/09 12:08

1だと１×１のマスに◇ ５だと５×５すなわち □□◇□□ □◇□◇□ ◇□◇□◇ □◇□◇□ □□◇□□ です

行動規範の内容に同意します

lang
1var center = num / 2;

を

lang
1var center = Math.floor(num / 2);

とすれば良いのではないかと思います。

追記：
質問の内容はこちらかと思いましたが

lang
1<script>
2    var num = prompt("奇数を入力してください");
3    var center = Math.floor(num / 2);
4    var diff = 0;
5
6    for (var i = 0; i < num; i++){
7        for (var j = 0; j < num; j++){
8            if(j == center - diff || j == center + diff){
9                document.write("◇");
10            }else{
11                document.write("　");
12            }
13        }
14        document.write("<br>");
15        if (i < center) {
16            diff++;
17        }else{
18            diff--;
19        }
20    }
21
22</script>

格子状にしたいのであれば条件を変える必要があります

lang
1<script>
2    var num = prompt("奇数を入力してください");
3    var center = Math.floor(num / 2);
4    var diff = 0;
5
6    for (var i = 0; i < num; i++){
7        for (var j = 0; j < num; j++){
8            if(center - diff <= j && j <= center + diff && (i + j) % 2 == 0){
9                document.write("◇");
10            }else{
11                document.write("　");
12            }
13        }
14        document.write("<br>");
15        if (i < center) {
16            diff++;
17        }else{
18            diff--;
19        }
20    }
21
22</script>