javascript — неверные вершины в 3-м цилиндре

Неверные вершины в 3-м цилиндре

Прямо сейчас я пытаюсь нарисовать трехмерную цилиндрическую форму в webgl, где верх тоньше, чем низ. Цилиндр также не имеет крышки. Цилиндр нарисован с использованием треугольников для сторон, с додекагоном (12 сторон) в качестве круга. Однако одна из моих сторон, кажется, имеет треугольник, указывающий неправильный путь.

https://imgur.com/a/ntgjrIa Я оставил это как гиперссылку на imgur, потому что у меня есть несколько картинок ситуации.

Это мои жестко закодированные вершины и индексы. Есть куча неиспользованных, потому что они были для верхней и нижней крышки, которые я выяснил позже, что мне не нужно, и я решил, что будет проще закомментировать их, чем удалить их.

 var vertices = new Float32Array([ // Vertex coordinates indicies 0.0, 1.0, 0.5, -0.25, 1.0, 0.433, -0.433, 1.0, 0.25, -0.5, 1.0, 0.0, // u0- u1- u2- u3 up 0, 1, 2, 3, -0.433, 1.0, -0.25, -0.25, 1.0,-0.433, 0.0, 1.0, -0.5, 0.25, 1.0,-0.433, // u4- u5- u6- u7 up 4, 5, 6, 7, 0.433, 1.0, -0.25, 0.5, 1.0, 0.0, 0.433, 1.0, 0.25, 0.25, 1.0, 0.433, // u8- u9- u10-u11 up 8, 9,10,11, 0.0, 1.0, 0.5, // u12 up middle 12, 0.0, 1.0, 0.5, -0.25, -1.0, 0.433, -0.5, -1.0, 0.866, 0.0, -1.0, 1.0, // u0- u1- d1- d0 13,14,15,16, -0.25, 1.0, 0.433, -0.433, 1.0, 0.25, -0.866, -1.0, 0.5, -0.5, -1.0, 0.866, // u1- u2- d2- d1 17,18,19,20, -0.433, 1.0, 0.25, -0.5, 1.0, 0.0, -1.0, -1.0, 0.0, -0.866, -1.0, 0.5, // u2- u3- d3- d2 21,22,23,24, -0.5, 1.0, 0.0, -0.433, 1.0, -0.25, -0.866, -1.0, -0.5, -1.0, -1.0, 0.0, // u3- u4- d4- d3 25,26,27,28, -0.433, 1.0, -0.25, -0.25, 1.0,-0.433, -0.5, -1.0,-0.866, -0.866, -1.0, -0.5, // u4- u5- d5- d4 29,30,31,32, -0.25, 1.0,-0.433, 0.0, 1.0, -0.5, 0.0, -1.0, -1.0, -0.5, -1.0,-0.866, // u5- u6- d6- d5 33,34,35,36, 0.0, 1.0, -0.5, 0.25, 1.0,-0.433, 0.5, -1.0,-0.866, 0.0, -1.0, -1.0, // u6- u7- d7- d6 37,38,39,40, 0.25, 1.0,-0.433, 0.433, 1.0, -0.25, 0.866, -1.0, -0.5, 0.5, -1.0,-0.866, // u7- u8- d8- d7 41,42,43,44, 0.433, 1.0, -0.25, 0.5, 1.0, 0.0, 1.0, -1.0, 0.0, 0.866, -1.0, -0.5, // u8- u9- d9- d8 45,46,47,48, 0.5, 1.0, 0.0, 0.433, 1.0, 0.25, 0.866, -1.0, 0.5, 1.0, -1.0, 0.0, // u9- u10-d10-d9 49,50,51,52, 0.433, 1.0, 0.25, 0.25, 1.0, 0.433, 0.5, -1.0, 0.866, 0.866, -1.0, 0.5, // u10-u11-d11-d10 53,54,55,56, 0.25, 1.0, 0.433, 0.0, 1.0, 0.5, 0.0, -1.0, 1.0, 0.5, -1.0, 0.866, // u11-u0- d0- d11 57,58,59,60, 0.0, -1.0, 1.0, -0.5, -1.0, 0.866, -0.866, -1.0, 0.5, -1.0, -1.0, 0.0, // d0- d1- d2- d3 down 61,62,63,64, -0.866, -1.0, -0.5, -0.5, -1.0,-0.866, 0.0, -1.0, -1.0, 0.5, -1.0,-0.866, // d4- d5- d6- d7 down 65,66,67,68, 0.866, -1.0, -0.5, 1.0, -1.0, 0.0, 0.866, -1.0, 0.5, 0.5, -1.0, 0.866, // d8- d9- d10-d11 down 69,70,71,72, 0.0, 1.0, 0.5, // d12 down middle 73, ]); var indices = new Uint8Array([ // Indices of the vertices //0, 1,12, 1, 2,12, 2, 3,12, 3, 4,12, 4, 5,12, 5, 6,12, 6, 7,12, 7, 8,12, 8, 9,12, 9,10,12, 10,11,12, 11, 0,12, //top cap 13,14,15, 13,15,16, 17,18,19, 17,19,20, 21,22,23, 21,23,24, 25,26,27, 25,27,28, 29,30,31, 29,31,32, 33,34,35, 33,35,36, 37,38,39, 37,39,40, 41,42,43, 41,43,44, 45,46,47, 45,47,48, 49,50,51, 49,51,52, 53,54,55, 53,55,56, 57,58,59, 57,59,60, //61,62,73, 62,63,73, 63,64,73, 64,65,73, 65,66,73, 66,67,73, 67,68,73, 68,69,73, 69,70,73, 70,71,73, 71,72,73, 72,61,73, //bottom cap ]); 
Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector