PyOpenGL -使用VBO绘制不同颜色的多个三角形

PyOpenGL是一个用于Python语言的OpenGL绑定库，它允许开发者使用Python语言进行OpenGL编程。OpenGL是一种跨平台的图形库，用于渲染2D和3D图形。VBO（Vertex Buffer Object）是一种用于高效渲染图形的技术，它将顶点数据存储在显存中，减少了数据传输的开销。

绘制不同颜色的多个三角形可以通过以下步骤实现：

导入PyOpenGL库和相关模块：

from OpenGL.GL import *
from OpenGL.GLUT import *
from OpenGL.GLU import *

初始化OpenGL环境：

glutInit()
glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB)
glutInitWindowSize(800, 600)
glutCreateWindow(b"PyOpenGL - Multiple Triangles")

定义顶点数据和颜色数据：

vertices = [
    -0.5, -0.5, 0.0,
    0.5, -0.5, 0.0,
    0.0, 0.5, 0.0,

    -0.5, 0.5, 0.0,
    0.5, 0.5, 0.0,
    0.0, -0.5, 0.0
]

colors = [
    1.0, 0.0, 0.0,
    0.0, 1.0, 0.0,
    0.0, 0.0, 1.0,

    1.0, 1.0, 0.0,
    0.0, 1.0, 1.0,
    1.0, 0.0, 1.0
]

创建并绑定顶点缓冲对象：

vbo = glGenBuffers(2)
glBindBuffer(GL_ARRAY_BUFFER, vbo[0])
glBufferData(GL_ARRAY_BUFFER, len(vertices) * 4, (GLfloat * len(vertices))(*vertices), GL_STATIC_DRAW)

glBindBuffer(GL_ARRAY_BUFFER, vbo[1])
glBufferData(GL_ARRAY_BUFFER, len(colors) * 4, (GLfloat * len(colors))(*colors), GL_STATIC_DRAW)

设置顶点和颜色数据的指针：

glBindBuffer(GL_ARRAY_BUFFER, vbo[0])
glVertexPointer(3, GL_FLOAT, 0, None)

glBindBuffer(GL_ARRAY_BUFFER, vbo[1])
glColorPointer(3, GL_FLOAT, 0, None)

启用顶点和颜色数据：

glEnableClientState(GL_VERTEX_ARRAY)
glEnableClientState(GL_COLOR_ARRAY)

绘制多个三角形：

glDrawArrays(GL_TRIANGLES, 0, 6)

禁用顶点和颜色数据：

glDisableClientState(GL_VERTEX_ARRAY)
glDisableClientState(GL_COLOR_ARRAY)

刷新显示：

glutSwapBuffers()

相关·内容

写给 python 程序员的 OpenGL 教程

由于许多函数可以接收不同数以下几类。据类型的参数，因此派生出来的函数原形多达300多个。...GL_POLYGON 绘制多边形 GL_TRIANGLES 绘制一个或多个三角形 GL_TRIANGLE_STRIP 绘制连续三角形 GL_TRIANGLE_FAN 绘制多个三角形组成的扇形 GL_QUADS...绘制一个或多个四边形 GL_QUAD_STRIP 绘制连续四边形 4.2 第一个 OpenGL 程序通常，我们使用工具库（GLUT）创建 OpenGL 应用程序。...如果把这些都放到初始化时候完成，使用一种结构记录该次绘制所需要的所有 VBO 所需信息，把它保存到 VBO特定位置，绘制的时候直接在这个位置取信息绘制，会简化渲染流程、提升渲染速度。...（VBO）使用glDrawElements() 等函数绘制前，需要先绑定顶点数据集和索引数据集，然后使用glInterleavedArrays() 分理出顶点、颜色、法线等数据。

3.2K3 0

万字长文详解如何用Python玩转OpenGL | CSDN 博文精选

安装 PyOpenGL 如果想当然地使用 pip 如下所示安装，可能会有一些麻烦。...由于许多函数可以接收不同数以下几类。据类型的参数，因此派生出来的函数原形多达300多个。...和设置颜色类似，设置顶点的函数也有几十个，都是以 glVertex 开头，后面跟着参数个数和参数类型，同样也支持将多个以向量方式传递。...如果把这些都放到初始化时候完成，使用一种结构记录该次绘制所需要的所有 VBO 所需信息，把它保存到 VBO特定位置，绘制的时候直接在这个位置取信息绘制，会简化渲染流程、提升渲染速度。...（VBO）使用glDrawElements() 等函数绘制前，需要先绑定顶点数据集和索引数据集，然后使用glInterleavedArrays() 分理出顶点、颜色、法线等数据。

9.1K2 1

使用Matplotlib绘制不同颜色的带箭头的线实例

as colors import matplotlib.cm as cmx 后面两个主要是用于处理颜色的。...，cNorm设置颜色的范围，有几条线路就设置几种颜色，scalarMap颜色生成完毕。...最后在绘图的时候，根据索引获得相应的颜色就可以了。结果如下： ? 补充知识：Python包matplotlib绘图–如何标注某点–附代码 ?...'Package B') plt.xlim(-0.5, 20) plt.ylim(-0.5, 20) plt.legend() fig01 = plt.figure() plt.show() 以上这篇使用...Matplotlib绘制不同颜色的带箭头的线实例就是小编分享给大家的全部内容了，希望能给大家一个参考。

3.3K1 0

一看就懂的 OpenGL 基础概念（3）：各种 O 之 VBO、EBO、VAO丨音视频基础

7.1、VBO 和 EBO 在 OpenGL 开发中，用于绘制的顶点数据首先是存储在 CPU 内存中的，比如我们在《RenderDemo（1）：用 OpenGL 画一个三角形》中的三角形的 3 个顶点数据...在《RenderDemo（1）：用 OpenGL 画一个三角形》的 iOS Demo 中我们用到了 VBO。 2）我们接着来看看 EBO 的使用：假设我们不再绘制一个三角形而是绘制一个矩形。...更好的解决方案是只储存不同的顶点，并设定绘制这些顶点的顺序。这样子我们只要储存 4 个顶点就能绘制矩形了，之后只要指定绘制的顺序就行了。...0, 1, 3, // 第一个三角形 1, 2, 3 // 第二个三角形 }; // 使用 VBO： GLuint VBO; glGenBuffers(1, &VBO); // 创建 VBO...(0); // 解绑 VAO 上面的代码相比我们用 VBO 绘制三角形的代码还是复杂一些的，上面的代码可以理解为：使用 VAO 记录 VBO 的操作相当于创建了一个快捷方式，后面直接用 VAO 快捷方式绘制

1.1K1 0

1.opengl绘制三角形

所以，即使在片段着色器中计算出来了一个像素输出的颜色，在渲染多个三角形的时候最后的像素颜色也可能完全不同。...OpenGL允许我们同时绑定多个缓冲，只要它们是不同的缓冲类型。...(每帧都不同,一次修改，一次使用) 现在我们已经把顶点数据储存在显卡的内存中，用VBO这个顶点缓冲对象管理。...();// 绘制物体 glBindVertexArray(0); //绘制完成,便解绑,用来绑定下一个要绘制的物体这里,我们一直再调用glBindVertexArray()绑定和解绑,是为了方便绘制有多个...)、GL_TRIANGLES(每三个顶点组成一个三角形)、 //GL_TRIANGLE_STRIP(共用多个顶点的一个三角形)、GL_TRIANGLE_FAN(共用一个原点为中心的一个三角形)。

1.2K3 0

OpenGL学习笔记（二）- 顶点与绘制指令

这篇笔记将详细探讨这个话题，并介绍几何图形的绘制方式。几何图元 OpenGL中有若干几何图元，但是最终这些图元都会被转化为点、线和三角形。通过组合三角形，OpenGL还额外提供了条带和扇面。...通过缓冲，我们可以把诸如顶点数据等等的数据放置在图形硬件的高速存储器（又叫显存）中，供后续绘制等操作使用。因此OpenGL中有若干不同类型的缓冲，缓冲管理也有一个通用的接口。...而VAO可以绑定多个顶点属性指针（只要index不同），一个VAO事实上可以同时“绑定”多个VBO。这个连接建立的时机是glVertexAttribPointer函数的调用。...数据布局了解了VAO、VBO与顶点属性指针的内容之后，就可以处理不同样式的数据布局了。我们假设现在有三种顶点属性：位置（3分量，用P表示）、颜色（3分量，用C表示）、纹理坐标（2分量，用T表示）。...使用索引进行绘制的意义在于减少重复数据。在绘制中，经常会遇到两个顶点相同的情况（比如正方体的顶点），使用索引可以减少重复数据点，节省存储空间。

1.6K1 0

4.QOpenGLWidget-对三角形进行纹理贴图、纹理叠加

在上章3.QOpenGLWidget-通过着色器来渲染渐变三角形,我们为每个顶点添加颜色来增加图形的细节，从而创建出有趣的图像。...但是，如果想让图形看起来更真实，我们就必须有足够多的顶点，从而指定足够多的颜色。这将会产生很多额外开销。所以使用纹理(Texture)。...，它可以采用几种不同的插值方式。...然后绘制物体时,把摄像机到物体的距离与阙值作比较，在不同的距离空间内选用不同的纹理图像。由于距离远，解析度不高也不会被用户注意到。所以多级渐远纹理只应用于纹理被缩小的情况下。..., 0.0f, // 左下 1.0f, 2.0f // 顶部所以是超过了范围(0, 0)到(1, 1),假如我们绘制mode改为QOpenGLTexture::ClampToEdge,就可以看出其实三角形是大于图片的

1.5K2 0

【C++】OpenGL：着色器基础与GLFW创建三角形示例

为了让OpenGL知道我们的坐标和颜色值构成的到底是什么，OpenGL需要你去指定这些数据所表示的渲染类型。是希望把这些数据渲染成一系列的点？一系列的三角形？还是仅仅是一个长长的线？...，这时可以添加新的顶点，例如添加一个新顶点形成2个三角形 几何处理完成后，进入光栅化阶段，会将图元转变为屏幕上真实显示的像素，形成片段，并且会丢弃掉视图之外的元素片段着色器的主要目的是计算一个像素的最终颜色...OpenGL允许我们同时绑定多个缓冲，只要它们是不同的缓冲类型。...它是多个着色器合并之后并最终链接完成的版本。...这样的好处就是，当配置顶点属性指针时，你只需要将那些调用执行一次，之后再绘制物体的时候只需要绑定相应的VAO就行了。这使在不同顶点数据和属性配置之间切换变得非常简单，只需要绑定不同的VAO就行了。

1581 0

3.QOpenGLWidget-通过着色器来渲染渐变三角形

在上章2.通过QOpenGLWidget绘制三角形,我们学习绘制三角形还是单色的，本章将为三角形每个顶点着色. 1.着色器描述着色器的开头总是要声明版本，接着是输入和输出变量、uniform和main...,比如我们想通过应用程序中根据不同情况来发送我们想渲染的颜色,该怎么办？...使用uniform变量 3.1 Uniform Uniform是一种从CPU中的应用向GPU中的（vertex和fragment）着色器发送数据的方式，但uniform和顶点属性有些不同。...变量值的xyzw分量 3.2 通过uniform设置三角形颜色接下来,我们在上章的三角形程序片元着色器中添加uniform变量,然后通过外部app来随着时间动态设置三角形颜色...., 0.0f, 1.0f // 顶部颜色对应蓝色 }; vbo.create(); vbo.bind(); //绑定到当前的OpenGL上下文, vbo.allocate(vertices, 18

9856 4

MATLAB画图使用不同的颜色

大家好，又见面了，我是你们的朋友全栈君。 1. 自动使用不同的颜色 plot(x1,y2,x2,y2,x3,y3,...); 此方法比较简单，能满足一般需要。...但默认只能在7种颜色之间循环，具体的颜色可通过以下命令查看 get(gca,'ColorOrder') 具体实例： x1 = linspace(1,10,100); y1 = sin(x1); y2...设置一个颜色rgb数组，通过循环使用不同颜色基本命令： plot(y,'color', [1 0 0]); 具体实例： close all; clear; clc; M = 10; N = 10...figure(1); hold on; % 在同一张图上绘制 for i = 1 : M plot(data(i,:),'color',color(i,:)); pause(...0.5); % 暂停0.5s end 对于上面的color，你也可以使用系统定义好的colormap ，基本命令： color = colormap(jet(M)); % M 是你要用的颜色数量具体实例

1.3K1 0

最简WebGL教程，仅需 75 行代码

一个等边三角形，顶部为绿色，左下为黑色，右下为红色，中间有过渡颜色初始化要使用 WebGL，需要用 canvas 进行绘制。...OpenGL 的世界中的颜色是RGBA，每个分量都在 0 和 1 之间。透明色是用于在重新绘制场景的帧的开始时绘制画布的颜色。...OpenGL 提供了一种被称为“顶点缓冲对象”（VBO）的抽象。我仍在试图完全弄清楚它的工作原理，但是最终，我们将会使用抽象来进行以下操作：将一系列字节存储在 CPU 的内存中。...尽管在顶点着色器中每个输入变量（属性）都有一个 VBO，但也可以把一个 VBO 用于多个输入。...如果我们将这两个功能分开（例如一次性创建所有 VBO，然后将它们与各个属性相关联），则需要在将每个 VBO 与对应的属性相关联之前调用 gl.bindBuffer(...)。绘制！

1.9K3 1

Canvas使用beginPath()绘画不同颜色的直线

使用strokeStyle和lineWidth设置画笔的颜色以及宽度 ?...，那么会不会画出三条不同颜色的直线呢？...原因是因为每条直线都各自设置context的属性，上面的属性设置都被最下面的设置覆盖了，所以就是最后设置的粉红色。那么怎么才可以绘画出三条不同颜色的指向呢？...使用beginPath()开启新路径，绘画三条不同颜色的直线 ?...看看浏览器的展示如下： ?

2K2 0

RenderDemo（1）：用 OpenGL 画一个三角形丨音视频工程示例

在本文中，包括如下内容： 1）iOS OpenGL 绘制三角形 Demo； 2）Android OpenGL 绘制三角形 Demo； 3）详尽的代码注释，帮你理解代码逻辑和原理。...，我们的 Demo 里会用它作为绘制三角形的图层。...VBO 的作用是在显存中提前开辟好一块内存，用于缓存顶点数据，从而避免每次绘制时的 CPU 与 GPU 之间的内存拷贝，可以提升渲染性能。...6）清理窗口颜色，并设置渲染窗口； 7）加载和编译 shader，并链接到着色器程序； 8）根据三角形顶点信息申请顶点缓冲区对象 VBO 和拷贝顶点数据；这里 VBO 的作用是在显存中提前开辟好一块内存...最终我们画出的三角形如下图所示： OpenGL 绘制三角形（Android） - 完 -

1.2K3 1

Canvas 使用createLinearGradient绘制颜色渐变的矩形

需求之前我使用遍历的方式绘制了一个线的颜色渐变，这种方式其实不好，本章节来看看使用createLinearGradient方法来设置颜色渐变。...首先使用fillRect（x，y，w，h）绘画一个矩形 <!...使用createLinearGradient设置渐变色 createLinearGradient() 方法创建线性的渐变对象。渐变可用于填充矩形、圆形、线条、文本等等。...提示：请使用该对象作为 strokeStyle或 fillStyle 属性的值。提示：请使用addColorStop()方法规定不同的颜色，以及在 gradient 对象中的何处定位颜色。...渐变结束点的 x 坐标 y1 渐变结束点的 y 坐标示例代码如下： <!

2.3K0 0

OpenGL现代编程第二课——第一个多边形

二、我们需要编程部分的图形渲染管线所以本节概括起来就是对输入顶点数据的管理——>顶点着色器、片段着色器——>绘制三角形。...着色器程序对象(Shader Program Object)是多个着色器合并之后并最终链接完成的版本，如果要使用刚才编译的着色器我们必须把它们链接(Link)为一个着色器程序对象，然后在渲染对象的时候激活这个着色器程序...已激活着色器程序的着色器将在我们发送渲染调用的时候被使用。最后绘制三角形。...，芥末味、黄瓜味、酸奶味等等；最后通过着色器程序把不同口味的土豆片变成不同口味的薯片；；关于链接顶点属性，是自动化切割土豆片时需要设置一次来了几个土豆，根据设置调整切割土豆的刀具，我实在快编不下去了.....第二个为用于存储单一ID或多个ID的GLuint变量或数组的地址 glGenVertexArrays(1, &VAO); glGenBuffers(1, &VBO);

7181 0

WebGL第三十课：多个绘制对象的参数调节-颜色

引子在上篇文章中，我们可以看到，如果想更改多个绘制对象中的某一个对象的参数时，我们直接重新申请的gl中的buffer，然后重新把所有的顶点数据传入到buffer中，进而绘制。...答：迭代当前buffer中的数据，例如坐标啦，颜色啦，啥的，然后在屏幕上绘制一个点，每三个点，就用插值法，绘制中间的区域，也就是绘制一个三角形，这样就将一个buffer中的数据都绘制完成。...也就是说不同buffer的数据，可以共用一个 program，但是在切换buffer的时候，我们可以对uniform变量进行修改，从而得到我们的目的，那就是，不同绘制对象的某些参数，可以自由独立的控制，...我们可以使用uniform这种动态的变量，和buffer中的静态颜色，进行叠加计算，从而得出好玩的效果。这点后面再说。...复制代码绘制多个格子在上篇文章，我们定义了一个 GridObject 的class，来描述一个格子的行为。

6983 0

【WebGL】一次drawcall中绘制多个不同纹理的图形

Demo： http://kenkozheng.github.io/WebGL/multi-texture-in-one-drawcall/index.html

1.7K1 0

WebGL2系列之实例数组(Instanced Arrays)

实例数组是这样的一个对象，使用它，可以把原来的的uniform变量转换成attribute变量，而且这个attribute变量对应的缓冲区可以被多个对象使用；这样在绘制的时候，可以减少webgl的调用次数...背景假设这样的一个场景：你需要绘制很多个形状相同的物体，但是每个物体的颜色、位置却不一样，通常的做法是这样的： for(var i = 0; i < amount_of_models_to_draw...实例化如果能够讲数据一次性发送给GPU，然后告诉WebGL使用一个绘制函数，绘制多个物体，就会更方便。这种技术，便是实例化技术。...接下来，就是和普通的VBO差异的部分：该缓冲区可以在多个对象之间共享。...// //////////////// gl.clear(gl.COLOR_BUFFER_BIT);// 清空颜色缓冲区 // // 绘制第一个三角形 gl.bindVertexArray

1.6K3 0

WASM + OpenGL + C++ 入门：绘制三角形

安装和入门可以看这篇文章：《wasm 初探，写个 Hello World》红色三角形 还是老样子，图形渲染的 helloworld：画一个红色三角形。...position); // 清空屏幕 glClearColor(0, 1, 1, 0); // 背景色为 #00FFFF glClear(GL_COLOR_BUFFER_BIT); // 清空颜色缓存...glDrawArrays(GL_TRIANGLES, 0, 3); // 绘制三角形 glDeleteBuffers(1, &vbo); } WebGL 代码对照：《一起学 WebGL...：绘制三角形》执行下面命令进行编译 emcc red_triangle.cpp -std=c++11 -s WASM=1 -s USE_SDL=2 -O3 -o index.html 效果更新三角形顶点位置...再尝试通过 JavaScript 给 wasm 通信，更新三角形的顶部的顶点信息然后重新渲染。

8402 1

12.QT-通过QOpenGLWidget显示YUV画面,通过QOpenGLTexture纹理渲染YUV

如果软件中通过公式来实现软解码的话,会耗掉很多CPU,所以使用opengl,我们只需要将YUV数据传给opengl,然后opengl通过GPU硬件加速图形绘制来实现硬解码....需要学习: 2.通过QOpenGLWidget绘制三角形 3.QOpenGLWidget-通过着色器来渲染渐变三角形 4.QOpenGLWidget-对三角形进行纹理贴图、纹理叠加项目流程如下所示:...FragColor ：控制输出的颜色(rgba)，（在3.3版本后需要通过out的方式来声明） texture2D(texU, TexCoord).r-0.5: 由于opengl接受的颜色值为(0.0...(); vbo.bind(); vbo.bind(); //绑定到当前的OpenGL上下文, vbo.allocate(vertices, sizeof...(vertices)); vbo.setUsagePattern(QOpenGLBuffer::StaticDraw); //设置为一次修改，多次使用(坐标不变,变得只是像素点) /

3.7K4 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云