If you're seeing this message, it means we're having trouble loading external resources on our website.

Եթե գտնվում ես վեբ զտիչի հետևում, խնդրում ենք համոզվել, որ *.kastatic.org և *.kasandbox.org տիրույթները հանված են արգելափակումից։

Հիմնական նյութ

Ստանալ եռաչափ մարմիններ

Ուրեմն, հիմա ունենք մի խորանարդ: Իսկ ի՞նչ կլինի, եթե ցանկանանք փոխել խորանարդի դիրքը, չափը կամ էլ ունենանք ուղղանկյունաձև վեցանիստ կամ շատ վեցանիստեր: Տվյալ կոդով մենք ստիպված ենք մեկ առ մեկ փոխել հանգույցները, ինչը անիմաստ է: Անհրաժեշտ է մի պարզ մեթոդ, որով կկարողանանք ստեղծել վեցանիստ՝ հստակ դիրքի և հարթության: Այլ կերպ ասած՝ ցանկանում ենք ունենալ մի ֆունկցիա, որը դիրքը և հարթությունները վերածում է հանգույցների և կողմերի շարքի:

Վեցանիստի սահմանումը

Վեցանիստն ունի երեք չափում՝ լայնություն, բարձրություն և խորություն:
Այն նաև իր դիրքն ունի 3D տարածությունում՝ մեզ տալով վեց պարամետր: Խորանարդի դիրքը սահմանելու երկու տարբերակ կա. կարող ենք սահմանել խորանարդի կենտրոնը կամ էլ մի անկյունը: Առաջինն ավելի տարածված է, իսկ երկրորդը ավելի հեշտ է կիրառել:
Անհրաժեշտ է, որ մեր ֆունկցիան վերադարձնի և հանգույցները, և կողմերի շարքը: Երկու փոփոխականները վերադարձնելու տարբերակներից մեկը փոփոխականի տեղակայումն է օբյեկտի՝ հանգույցներով և կողմերով: Ուշադրություն դարձրու, որ կարող ես օգտագործել ցանկացած տող, որպեսզի հնարավոր լինի հղում կատարել փոփոխականին. պարզապես ավելի հեշտ է օգտագործել նույն բառը:
// Ստեղծիր մի վեցանիստ  գագաթի տվյալներով (x, y, z)
//  w լայնությամբ,  h բարձրությամբ և  d խորությամբ:
var createCuboid = function(x, y, z, w, h, d) {
   var nodes = [];
   var edges = [];
   var shape = { 'nodes': nodes, 'edges': edges };
   return shape;
};
Եթե օգտագործեինք այդ ֆունկցիան՝ վեցանիստ ստանալու համար, կհասնեինք առաջին հանգույցին այսպես՝
var object = createCuboid(0, 0, 0, 100, 160, 50);
var node0 = shape.nodes[0];
Սրա շնորհիվ node0-ին կփոխանցվի nodes զանգվածի առաջին արժեքը։ Այնուամենայնիվ, այս պահին հանգույցների կամ կողերի զանգվածում արժեքներ չկան։
Հանգույցներն այնպես կսահմանենք, որ դրանք լինեն յուրաքանչյուր դիրքին համապատասխան հարթության կամ առանց համապատասխան հարթության համադրում: Կողմերը կսահմանեն նույն եղանակով, ինչ որ նախկինում (բացի այն դեպքերից, երբ, ի տարբերություն մեկ առ մեկ սահմանելու, կսահմանենք բոլորը միանգամից): Ուշադրություն դարձրու, որ այս ֆունկցիան հնարավորություն է տալիս բացասական հարթություններ սահմանել վեցանիստի համար:
var createCuboid = function(x, y, z, w, h, d) {
   var nodes = [[x, y, z ], [x, y, z+d], [x, y+h, z ], [x, y+h, z+d], [x+w, y, z ], [x+w, y, z+d], [x+w, y+h, z ], [x+w, y+h, z+d]];

   var edges = [[0, 1], [1, 3], [3, 2], [2, 0], [4, 5], [5, 7], [7, 6], [6, 4], [0, 4], [1, 5], [2, 6], [3, 7]];

   return { 'nodes': nodes, 'edges': edges};
};
Կարող ենք ստանալ 100 լայնությամբ, 160 բարձրությամբ, 50 խորությամբ վեցանիստ և մեկ հանգույց դրա վրա այսպես՝
var shape = createCuboid(0, 0, 0, 100, 160, 50);
Քանի որ մեր նախկին կոդը միայն հղում է ընդհանուր հանգույցներ և կողմեր փոփոխականներին, անհրաժեշտ է պահեստավորել մեր օբյեկտի հատկությունները հետևյալ ընդհանուր փոփոխականներում.
var nodes = shape.nodes; var edges = shape.edges;
Ամբողջական կոդը կարող ես տեսնել ստորև.

Աշխատանքը բազմաթիվ մարմինների հետ

Կարող ենք ստեղծել տարբեր հարթություններում գտնվող մարմիններ, իսկ ի՞նչ կլինի, եթե ցանկանանք ստեղծել մեկից ավելին: Շարքը կարող է օգնել, երբ ցանկանում ենք ունենալ տարբեր քանակությամբ մարմիններ: Դե ուրեմն արի ստեղծենք մարմինների շարք:
var shape1 = createCuboid(-120, -20, -20, 240, 40, 40);
var shape2 = createCuboid(-120, -50, -30, -20, 100, 60);
var shape3 = createCuboid( 120, -50, -30, 20, 100, 60);
var shapes = [shape1, shape2, shape3];
Այժմ պետք է փոխենք ցուցադրվածը և պտտենք ֆունկցիան, որ կարողանանք աշխատել օբյեկտների շարքի հետ: Դիր կոդը, որպեսզի այն ցուցադրի կողերը ցիկլում, որն էլ կրկնվում է բոլոր մարմիններում:
// Draw edges
stroke(edgeColor);
for (var shapeNum = 0; shapeNum < shapes.length; shapeNum++) {
   var nodes = shapes[shapeNum].nodes;
   var edges = shapes[shapeNum].edges;
   for (var e = 0; e < edges.length; e++) {
      var n0 = edges[e][0];
      var n1 = edges[e][1];
      var node0 = nodes[n0];
      var node1 = nodes[n1];
      line(node0[0], node0[1], node1[0], node1[1]);
   }
}
Եվ նմանատիպ for ցիկլ հանգույցների ցուցադրման համար.
// Draw nodes
fill(nodeColor);
noStroke();
for (var shapeNum = 0; shapeNum < shapes.length; shapeNum++) {
   var nodes = shapes[shapeNum].nodes;
   for (var n = 0; n < nodes.length; n++) {
      var node = nodes[n]; ellipse(node[0], node[1], nodeSize, nodeSize);
   }
}
Կարող ենք նմանատիպ ցիկլ ավելացնել յուրաքանչյուր պտտման ֆունկցիային, բայց ավելի հարմար է փոխանցել հանգույցների շարքը յուրաքանչյուր ֆունկցիային: Այսպիսով՝ կարող ենք պտտել մարմինները՝ մեկը մյուսից անկախ: Օրինակ՝ rotateZ3D() ֆունկցիան կունենա հետևյալ տեսքը.
var rotateZ3D = function(theta, nodes) { ... };
Այժմ, երբ օգտագործում ենք մկնիկը՝ պտտելու համար, ստիպված ենք կրկնել գործողությունը մարմինների համար և կանչել ֆունկցիան յուրաքանչյուրի համար.
mouseDragged = function() {
   var dx = mouseX - pmouseX;
   var dy = mouseY - pmouseY;
   for (var shapeNum = 0; shapeNum < shapes.length; shapeNum++) {
      var nodes = shapes[shapeNum].nodes;
      rotateY3D(dx, nodes);
      rotateX3D(dy, nodes);
   }
};
Համոզվիր, որ ջնջում ես պտտման ֆունկցիայի՝ հանգույց չփոխանցող կանչերը։ Ամբողջական կոդը կգտնես ստորև։

Ուզո՞ւմ ես միանալ խոսակցությանը։

Առայժմ հրապարակումներ չկան։
Անգլերեն հասկանո՞ւմ ես: Սեղմիր այստեղ և ավելի շատ քննարկումներ կգտնես «Քան» ակադեմիայի անգլերեն կայքում: