{"id":328,"date":"2021-06-29T20:45:25","date_gmt":"2021-06-29T12:45:25","guid":{"rendered":"http:\/\/liyanliang.net\/?p=328"},"modified":"2021-06-30T09:04:49","modified_gmt":"2021-06-30T01:04:49","slug":"modern-opengl-drawcylinder","status":"publish","type":"post","link":"http:\/\/liyanliang.net\/index.php\/2021\/06\/29\/modern-opengl-drawcylinder\/","title":{"rendered":"Modern OpenGL\u7ed8\u5236\u5706\u67f1\u4f53"},"content":{"rendered":"\n<p>\u672c\u6587\u4e3b\u8981\u4ecb\u7ecd\u5982\u4f55\u4f7f\u7528 C++ \u751f\u6210\u5706\u67f1\u51e0\u4f55\u4f53\u4ee5\u53ca\u5982\u4f55\u5728 OpenGL \u4e2d\u7ed8\u5236\u5b83\u3002<\/p>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>1.\u7ed8\u5236\u65b9\u6cd5<\/strong><\/p>\n\n\n\n<p>\u7531\u4e8e\u6211\u4eec\u65e0\u6cd5\u7ed8\u5236\u4e00\u4e2a\u5b8c\u7f8e\u7684\u5706\u5f62\u5e95\u9762\u548c\u5706\u67f1\u4f53\u7684\u5f2f\u66f2\u4fa7\u9762\uff0c\u6211\u4eec\u53ea\u80fd\u901a\u8fc7\u5c06\u5e95\u9762\u9664\u4ee5\u6247\u533a\uff08\u5207\u7247\uff09\u6765\u91c7\u6837\u6709\u9650\u6570\u91cf\u7684\u70b9\u3002\u56e0\u6b64\uff0c\u5b83\u5728\u6280\u672f\u4e0a\u662f\u901a\u8fc7\u5c06\u8fd9\u4e9b\u91c7\u6837\u70b9\u8fde\u63a5\u5728\u4e00\u8d77\u6765\u6784\u5efa\u68f1\u67f1\u4f53\u3002\u968f\u7740\u6837\u672c\u6570\u91cf\u7684\u589e\u52a0\uff0c\u51e0\u4f55\u5f62\u72b6\u66f4\u63a5\u8fd1\u4e8e\u5706\u67f1\u4f53\u3002<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/liyanliangpublic.oss-cn-hongkong.aliyuncs.com\/img\/20210629182126.png\" alt=\"\"\/><\/figure><\/div>\n\n\n\n<p>\u5047\u8bbe\u4e00\u4e2a\u5706\u67f1\u4f53\u4ee5\u539f\u70b9\u4e3a\u4e2d\u5fc3\uff0c\u534a\u5f84\u4e3a<em>r<\/em>\uff0c\u9ad8\u5ea6\u4e3a<em>h<\/em>\u3002\u5706\u67f1\u4f53\u4e0a\u7684\u4efb\u610f\u70b9 ( <em>x, y, z<\/em> ) \u53ef\u4ee5\u4ece\u5177\u6709\u76f8\u5e94\u6247\u5f62\u89d2<em>\u03b8<\/em>\u7684\u5706\u65b9\u7a0b\u8ba1\u7b97\u51fa\u6765\uff1a<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/liyanliangpublic.oss-cn-hongkong.aliyuncs.com\/img\/20210629181915.png\" alt=\"\"\/><\/figure><\/div>\n\n\n\n<p>\u6247\u5f62\u89d2\u7684\u8303\u56f4\u662f\u4ece 0 \u5230 360 \u5ea6\u3002\u6bcf\u4e2a\u6b65\u9aa4\u7684\u6247\u5f62\u89d2\u53ef\u4ee5\u901a\u8fc7\u4ee5\u4e0b\u65b9\u5f0f\u8ba1\u7b97\uff1a<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/liyanliangpublic.oss-cn-hongkong.aliyuncs.com\/img\/20210629182048.png\" alt=\"\"\/><\/figure><\/div>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>2.\u521b\u5efa\u5b58\u653e\u9876\u70b9\u5411\u91cf\u548c\u6cd5\u5411\u91cf\u7684\u7ed3\u6784\u4f53\uff1a<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">struct TVertex {\n\t\/\/ position\n\tglm::vec3 Position;\n\t\/\/ normal\n\tglm::vec3 Normal;\n};<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\">\u200b<strong>3.\u8ba1\u7b97\u5706\u5468\u4e0a\u7684\u70b9<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">const int sectorCount = 36; \nconst float pierRadius = 2.0f;\nconst float pierHeight = 5.0f;\n\/\/ \u5706\u5468\u9876\u70b9\nstd::vector&lt;TVertex> getUnitCircleVertices()\n{\n    const float PI = 3.1415926f;\n    float sectorStep = 2 * PI \/ sectorCount;\n    float sectorAngle = 0.0f;\n\u200b\n    glm::vec3 position;\n    glm::vec3 normal;\n    TVertex tVertex;\n\u200b\n    std::vector&lt;TVertex> unitCircleVertices;\n    for (int i = 0; i &lt;= sectorCount; ++i)\n    {\n        sectorAngle = i * sectorStep;\n        position.x = pierRadius * cos(sectorAngle);\n        position.y = 0.0f;\n        position.z = pierRadius * sin(sectorAngle);\n\u200b\n        normal.x = cos(sectorAngle);\n        normal.y = 0.0f;\n        normal.z = sin(sectorAngle);\n\u200b\n        tVertex.Position = position;\n        tVertex.Normal = normal;\n\u200b\n        unitCircleVertices.push_back(tVertex);\n    }\n\u200b\n    return unitCircleVertices;\n}\n<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>4.\u83b7\u53d6\u5706\u67f1\u4f53\u4fa7\u9762\u3001\u9876\u9762\u3001\u5e95\u9762\u7684\u9876\u70b9\u548c\u6cd5\u5411\u91cf<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\/\/ generate vertices for a cylinder\nvoid buildCylinderVertices(std::vector&lt;TVertex>&amp; vertices)\n{\n    std::vector&lt;TVertex> unitVertices = getUnitCircleVertices();\n\u200b\n    \/\/ \u83b7\u53d6\u4e0a\u3001\u4e0b\u5706\u5468\u70b9\u6570\u7ec4\n    std::vector&lt;TVertex> vctTop;\n    std::vector&lt;TVertex> vctBot;\n\u200b\n    TVertex tVertex;\n    for(int i = 0; i &lt; unitVertices.size(); ++i)\n    {\n        tVertex.Position = unitVertices[i].Position;\n        tVertex.Position.y = pierHeight;\n        tVertex.Normal = unitVertices[i].Normal;\n        vctTop.push_back(tVertex);  \n\u200b\n        tVertex.Position.y = 0.0f;\n        vctBot.push_back(tVertex);     \n    }\n\u200b\n    assert(vctTop.size() >= 2);\n    assert(vctBot.size() >= 2);\n\u200b\n    \/\/ \u5706\u67f1\u4fa7\u9762\n    for(int i = 0; i &lt; vctTop.size() - 1; ++i)\n    {\n        \/\/ \u5de6\u4e09\u89d2\u5f62\n        vertices.push_back(vctTop[i]);\n        vertices.push_back(vctBot[i]);\n        vertices.push_back(vctBot[i+1]);\n        \n        \/\/ \u53f3\u4e09\u89d2\u5f62\n        vertices.push_back(vctTop[i]);\n        vertices.push_back(vctTop[i+1]);\n        vertices.push_back(vctBot[i+1]);\n    }\n    \n    \/\/ \u9876\u90e8\u5706\u5f62\n    glm::vec3 position;\n    for (int i = 0; i &lt; vctTop.size() - 1; ++i)\n    {\n        glm::vec3 position(0.0f, pierHeight, 0.0f);\n        glm::vec3 normal(0.0f, 1.0f, 0.0f);\n        tVertex.Position = position;\n        tVertex.Normal = normal;\n        vertices.push_back(tVertex);\n\u200b\n        tVertex.Position = vctTop[i].Position;\n        vertices.push_back(tVertex);\n\u200b\n        tVertex.Position = vctTop[i+1].Position;\n        vertices.push_back(tVertex);\n    }\n\u200b\n    \/\/ \u5e95\u90e8\u5706\u5f62\n    for (int i = 0; i &lt; vctBot.size() - 1; ++i)\n    {\n        glm::vec3 position(0.0f, 0.0f, 0.0f);\n        glm::vec3 normal(0.0f, -1.0f, 0.0f);\n        tVertex.Position = position;\n        tVertex.Normal = normal;\n        vertices.push_back(tVertex);\n\u200b\n        tVertex.Position = vctBot[i].Position;\n        vertices.push_back(tVertex);\n\u200b\n        tVertex.Position = vctBot[i+1].Position;\n        vertices.push_back(tVertex);\n    }\n}<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>5.\u5c06\u9876\u70b9\u548c\u6cd5\u5411\u91cf\u5b58\u5165\u7f13\u51b2\u533a<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\"> \u00a0std::vector&lt;TVertex> pierVertices;\n  buildCylinderVertices(pierVertices);\n  \n  unsigned int pierVBO, pierVAO;\n  glGenVertexArrays(1, &amp;pierVAO);\n  glGenBuffers(1, &amp;pierVBO);\n\u200b\n  glBindVertexArray(pierVAO);\n  glBindBuffer(GL_ARRAY_BUFFER, pierVBO);\n\u200b\n  glBufferData(GL_ARRAY_BUFFER, pierVertices.size() * sizeof(TVertex), &amp;pierVertices[0], GL_STATIC_DRAW);\n  \n  \/\/ position attribute\n  glEnableVertexAttribArray(0);\n  glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, sizeof(TVertex), (void*)0);\n  \/\/ normal attribute\n  glEnableVertexAttribArray(1);\n  glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, sizeof(TVertex), (void*)offsetof(TVertex, Normal));\n\u200b\n  glBindVertexArray(0);<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>6.\u7ed8\u5236\u5706\u67f1\u4f53<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">        glClearColor(0.9f, 0.9f, 0.9f, 1.0f);\n        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); \n\u200b\n        \/\/ be sure to activate shader when setting uniforms\/drawing objects\n        lightingShader.use();\n        lightingShader.setVec3(\"lightDirection\", -direction); \/\/ \u5e73\u884c\u5149\u65b9\u5411\n        \/\/lightingShader.setVec3(\"lightPos\", lightPos);\n        lightingShader.setVec3(\"lightColor\", 1.0f, 1.0f, 1.0f);\n        lightingShader.setVec3(\"viewPos\", camera.Position); \n\u200b\n        \/\/ \u6b63\u4ea4\u5e73\u884c\u7684\u89c6\u666f\u4f53\n        float fRatio = (float)SCR_WIDTH \/ (float)SCR_HEIGHT;\n        float fHeight = 10.0f;\n        float fWidth = fHeight*fRatio;\n        \/\/glm::mat4 projection = glm::ortho(-fWidth, fWidth, -fHeight, fHeight, -10.f, 100.f);\n        glm::mat4 projection = glm::perspective(glm::radians(camera.Zoom), (float)SCR_WIDTH \/ (float)SCR_HEIGHT, 0.1f, 100.0f); \/\/ \u900f\u89c6\u6295\u5f71     \n        lightingShader.setMat4(\"projection\", projection);\n\u200b\n        glm::mat4 viewOrigin = camera.GetViewMatrix();\n        lightingShader.setMat4(\"view\", viewOrigin);\n\u200b\n        \/\/ \u7ed8\u5236\u5706\u67f1\u4f53\n        viewOrigin = glm::rotate(viewOrigin, glm::radians(30.0f), glm::vec3(1.0f, 0.0f, 0.0f));\n        viewOrigin = glm::rotate(viewOrigin, glm::radians(15.0f), glm::vec3(0.0f, 0.0f, -1.0f));\n        lightingShader.setMat4(\"view\", viewOrigin);\n        glm::mat4 modelPier = glm::mat4(1.0f);\n        lightingShader.setMat4(\"model\", modelPier);\n        lightingShader.setVec3(\"objectColor\", glm::vec3(0.5f, 0.1f,0.3f));\n\u200b\n        glBindVertexArray(pierVAO);\n        glDrawArrays(GL_TRIANGLES, 0, pierVertices.size());<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>7.\u5220\u9664\u7f13\u51b2\u533a<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"cpp\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">    glDeleteVertexArrays(1, &amp;pierVAO);\n    glDeleteBuffers(1, &amp;pierVBO);<\/pre>\n\n\n\n<p class=\"has-cyan-bluish-gray-background-color has-background\"><strong>8.\u6548\u679c<\/strong><\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img decoding=\"async\" src=\"https:\/\/liyanliangpublic.oss-cn-hongkong.aliyuncs.com\/img\/OpenGL%E5%9C%86%E6%9F%B1%E4%BD%93.gif\" alt=\"\"\/><\/figure><\/div>\n\n\n\n<p><strong>9.\u5b8c\u6574\u7684\u9879\u76ee\u6e90\u4ee3\u7801<\/strong><\/p>\n\n\n\n<p><a href=\"https:\/\/pan.baidu.com\/s\/1cEUuAmY3JNUbt7sTNvTuyA\">https:\/\/pan.baidu.com\/s\/1cEUuAmY3JNUbt7sTNvTuyA<\/a><\/p>\n\n\n\n<p>\u63d0\u53d6\u7801\uff1alf5q<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u672c\u6587\u4e3b\u8981\u4ecb\u7ecd\u5982\u4f55\u4f7f\u7528 C++ \u751f\u6210\u5706\u67f1\u51e0\u4f55\u4f53\u4ee5\u53ca\u5982\u4f55\u5728 OpenGL \u4e2d\u7ed8\u5236\u5b83\u3002 1.\u7ed8\u5236\u65b9\u6cd5 \u7531\u4e8e\u6211\u4eec\u65e0\u6cd5\u7ed8\u5236\u4e00\u4e2a\u5b8c\u7f8e\u7684\u5706\u5f62\u5e95\u9762\u548c\u5706\u67f1\u4f53\u7684\u5f2f\u66f2\u4fa7\u9762\uff0c\u6211\u4eec\u53ea\u80fd\u901a\u8fc7\u5c06\u5e95\u9762\u9664\u4ee5\u6247\u533a\uff08\u5207\u7247\uff09\u6765\u91c7\u6837\u6709\u9650\u6570\u91cf\u7684\u70b9\u3002\u56e0\u6b64\uff0c\u5b83\u5728\u6280\u672f\u4e0a\u662f\u901a\u8fc7\u5c06\u8fd9\u4e9b\u91c7\u6837\u70b9\u8fde\u63a5\u5728\u4e00\u8d77\u6765\u6784\u5efa\u68f1\u67f1\u4f53\u3002\u968f\u7740\u6837\u672c\u6570\u91cf\u7684\u589e\u52a0\uff0c\u51e0\u4f55\u5f62\u72b6\u66f4\u63a5\u8fd1\u4e8e\u5706\u67f1\u4f53\u3002 \u5047\u8bbe\u4e00\u4e2a\u5706\u67f1\u4f53\u4ee5\u539f\u70b9\u4e3a\u4e2d\u5fc3\uff0c\u534a\u5f84\u4e3ar\uff0c\u9ad8\u5ea6\u4e3ah\u3002\u5706\u67f1\u4f53\u4e0a\u7684\u4efb\u610f\u70b9 ( x, y, z ) \u53ef\u4ee5\u4ece\u5177\u6709\u76f8\u5e94\u6247\u5f62\u89d2\u03b8\u7684\u5706\u65b9\u7a0b\u8ba1\u7b97\u51fa\u6765\uff1a \u6247\u5f62\u89d2\u7684\u8303\u56f4\u662f\u4ece 0 \u5230 360 \u5ea6\u3002\u6bcf\u4e2a\u6b65\u9aa4\u7684\u6247\u5f62\u89d2\u53ef\u4ee5\u901a\u8fc7\u4ee5\u4e0b\u65b9\u5f0f\u8ba1\u7b97\uff1a 2.\u521b\u5efa\u5b58\u653e\u9876\u70b9\u5411\u91cf\u548c\u6cd5\u5411\u91cf\u7684\u7ed3\u6784\u4f53\uff1a \u200b3.\u8ba1\u7b97\u5706\u5468\u4e0a\u7684\u70b9 4.\u83b7\u53d6\u5706\u67f1\u4f53\u4fa7\u9762\u3001\u9876\u9762\u3001\u5e95\u9762\u7684\u9876\u70b9\u548c\u6cd5\u5411\u91cf 5.\u5c06\u9876\u70b9\u548c\u6cd5\u5411\u91cf\u5b58\u5165\u7f13\u51b2\u533a 6.\u7ed8\u5236\u5706\u67f1\u4f53 7.\u5220\u9664\u7f13\u51b2\u533a 8.\u6548\u679c 9.\u5b8c\u6574\u7684\u9879\u76ee\u6e90\u4ee3\u7801 https:\/\/pan.baidu.com\/s\/1cEUuAmY3JNUbt7sTNvTuyA \u63d0\u53d6\u7801\uff1alf5q<\/p>\n","protected":false},"author":1,"featured_media":335,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[15],"class_list":["post-328","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-c","tag-opengl"],"_links":{"self":[{"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/posts\/328","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/comments?post=328"}],"version-history":[{"count":8,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/posts\/328\/revisions"}],"predecessor-version":[{"id":339,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/posts\/328\/revisions\/339"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/media\/335"}],"wp:attachment":[{"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/media?parent=328"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/categories?post=328"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/liyanliang.net\/index.php\/wp-json\/wp\/v2\/tags?post=328"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}