How to make circular graphics with JavaScript

"The idea of drawing questions"

1. Determine the number of times the graph has a total of several lines, that is, the outer loop
2. Make sure there are several elements in each row that represent several inner loops
3. Determine the number of each element, that is, the number of cycles per inner layer
Tips: Usually, find out the relationship between the number of each element and the line number, which is the maximum value of the current inner loop

Rectangle: Loop 5 times per line, then cycle 5 rows

<script type= "Text/javascript" >


for (Var a=1;a<=5;a++) {
for (Var b=1;b<=5;b++) {
document.write ("*");
}
document.write ("<br/>")
}



</script>

Right triangle: Like a rectangle, except that the number of loops in the line is equal to the row times

<script type= "Text/javascript" >


for (Var a=1;a<=5;a++) {
for (Var b=1;b<=a;b++) {
document.write ("*");
}
document.write ("<br/>")
}



</script>

Parallelogram: First design an accompanying increment of the space cycle, added in the rectangle

<script type= "Text/javascript" >


for (Var a=1;a<=5;a++) {
for (Var c=1;c<a;c++) {
document.write ("&nbsp&nbsp")
}

for (Var b=1;b<=5;b++) {
document.write ("*");

}
document.write ("<br/>")


}

</script>

Diamond: Divided into the upper and lower parts, the above section is similar to parallelogram structure, find * number and row of the relationship for 2n-1, complete the above loop. The lower half will be the upper part reversed.

<script type= "Text/javascript" >

for (var a = 1;a<=7;a=a+2) {
For (Var c=1;c<= (7-a)/2;c++) {
document.write ("&nbsp&nbsp")
}



for (var B = 1;b<=a;b=b+1) {
document.write ("1")
}

document.write ("<br/>")
}
for (var a = 5;a>=1;a=a-2) {
For (Var c=1;c<= (7-a)/2;c++) {
document.write ("&nbsp&nbsp")
}
for (var B = 1;b<=a;b=b+1) {
document.write ("1")
}
document.write ("<br/>")
}


</script>

Digital equilateral triangle: similar to the upper half of the diamond, but to be divided into left and right two loops, the left is incremented, the number is a row, and a decrement of the number of rows to 1

<script type= "Text/javascript" >

var D;


for (var a = 1;a<=7;a=a+2) {
For (Var c=1;c<= (7-a)/2;c++) {
document.write ("&nbsp&nbsp")
}

for (var B = 1;b<= (a+1)/2;b=b+1) {
document.write (b)
}

for (var B = (A-1)/2;b>=1;b=b-1) {
document.write (b)
}

document.write ("<br/>")
}



</script>

99 Multiplication Table

<script type= "Text/javascript" >

document.write ("<table border= ' 1px ' bordercolor= ' black ' align= ' center ' >")
for (var a = 1;a<=9;a++) {

document.write ("<tr>")
for (var b =1,c=1,e=b*c; b<=a;b++,c++) {
document.write ("<td>" +b+ "*" +c+ "=" +e+ "</td>")
}


document.write ("</tr>")
}

document.write ("</table>")


</script>

How to make circular graphics with JavaScript