@icanvas/renderer/webgl/canvas3d.js

这是icanvas的渲染模块

import * as Util from './utils.js';
const Precision = '#ifdef GL_ES\n#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\n#endif\n';
// const FragmentTest = ['precision mediump float;', 'void main(void){', 'float test = 0.1;', '%forloop%', 'gl_FragColor = vec4(0.0);', '}'].join('\n');
let Canvas = {
	SetSize(width, height) {
		this.canvas.width = width;
		this.canvas.height = height;
		this.viewport(0, 0, width, height);
	},
	AddProgram(Name, Vertex, Fragment) {
		if (!this.Programs) this.Programs = {};
		//生成程序
		if (!this.Programs[Name]) {
			if (typeof Vertex == 'function') Vertex = Vertex(this);
			if (typeof Fragment == 'function') Fragment = Fragment(this);
			this.Programs[Name] = this.GetProgram(Vertex, Fragment);
			console.log('新建着色器程序-' + Name + ':', this.Programs[Name]);
		}
		return this.Programs[Name];
	},
	UseProgram(Name) {
		//更换当前程序
		if (!this.Programs) this.Programs = {};
		if (!this.Programs[Name]) return console.error('程序不存在');
		if (this.Program !== this.Programs[Name]) {
			this.useProgram(this.Programs[Name]);
			this.Program = this.Programs[Name];
		}
		return this.Program;
	},
	GetProgram(VertexString, FragmentString) {
		//生成程序并附加编译好的着色器
		let program = this.createProgram();
		let vertex = Util.CompileShader(this, this.VERTEX_SHADER, VertexString);
		let fragment = Util.CompileShader(this, this.FRAGMENT_SHADER, Precision + FragmentString);
		this.attachShader(program, vertex);
		this.attachShader(program, fragment);
		this.linkProgram(program);
		//错误检查
		if (!this.getProgramParameter(program, this.LINK_STATUS)) {
			console.error('gl.VALIDATE_STATUS', this.getProgramParameter(program, this.VALIDATE_STATUS));
			console.error('gl.getError()', this.getError());
			if (this.getProgramInfoLog(program) !== '') {
				console.warn('Pixi.js Warning: gl.getProgramInfoLog()', this.getProgramInfoLog(program));
			}
			this.deleteProgram(program);
			program = null;
		}
		//清空着色器
		this.deleteShader(vertex);
		this.deleteShader(fragment);
		//查询所有变量
		Object.assign(program, Util.getAttributeData(this, program), Util.getUniformData(this, program));
		return program;
	},

	// GetMax() {
	// 	let gl = this;
	// 	var max = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
	// 	let shader = gl.createShader(gl.FRAGMENT_SHADER);
	// 	while (true) {
	// 		var src = '';
	// 		for (let i = 0; i < max; ++i) {
	// 			if (i > 0) src += '\nelse ';
	// 			if (i < max - 1) src += `if(test == ${i}.0){}`;
	// 		}
	// 		gl.shaderSource(shader, FragmentTest.replace(/%forloop%/gi, src));
	// 		gl.compileShader(shader);
	// 		if (gl.getShaderParameter(shader, gl.COMPILE_STATUS)) return max;
	// 		max = (max / 2) | 0;
	// 	}
	// },
	GetTexture(image) {
		//创建纹理对象1
		let texture = this.createTexture();
		//2.开启0号纹理单元
		this.activeTexture(this.TEXTURE0);
		//3.绑定纹理对象类型
		this.bindTexture(this.TEXTURE_2D, texture);
		this.pixelStorei(this.UNPACK_FLIP_Y_WEBGL, 1);
		//4.配置纹理参数
		this.texParameteri(this.TEXTURE_2D, this.TEXTURE_WRAP_S, this.CLAMP_TO_EDGE);
		this.texParameteri(this.TEXTURE_2D, this.TEXTURE_WRAP_T, this.CLAMP_TO_EDGE);
		this.texParameteri(this.TEXTURE_2D, this.TEXTURE_MIN_FILTER, this.NEAREST);
		this.texParameteri(this.TEXTURE_2D, this.TEXTURE_MAG_FILTER, this.NEAREST);
		//5.配置纹理图像
		this.texImage2D(this.TEXTURE_2D, 0, this.RGBA, this.RGBA, this.UNSIGNED_BYTE, image);
		this.bindTexture(this.TEXTURE_2D, null);
		return texture;
	},
	GetBuffer(vertex, type) {
		//创建顶点缓冲区对象
		var buffer = this.createBuffer();
		this.bindBuffer(type, buffer);
		this.bufferData(type, vertex, this.STATIC_DRAW);
		return buffer;
	},
};
export default Canvas;