function main(){
var canvas = document.getElementById("webgl");
var gl = getWebGLContext(canvas)
if (!gl){
console.log("Fail to get WebGL context");
return;
}else{
;
}
var VSHADER_SOURCE = function(){
/*
void main(){
gl_Position = vec4(0.0,0.0,0.0,1.0);
gl_PointSize = 10.0;
}
*/
}.toString().match(/\/\*([^]*)\*\//)[1]; var FSHADER_SOURCE = function(){
/*
void main(){
gl_FragColor = vec4(1.0,0.0,0.0,1.0);
}
*/
}.toString().match(/\/\*([^]*)\*\//)[1]; if (!initShaders(gl,VSHADER_SOURCE,FSHADER_SOURCE)){
console.log('Fail to init shaders');
return;
}
gl.clearColor(0.0,0.0,0.0,0.8);
gl.clear(gl.COLOR_BUFFER_BIT);
gl.drawArrays(gl.POINTS, 0, 1);
}

webgl画个点的更多相关文章

  1. WebGl 画线

    效果: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  2. WebGL画一个10px大小的点

    WebGL程序在屏幕上同时使用HTML和javascript来创建和显示三维图形.WebGL中新引入的<canvas>元素标签,它定义了网页上的绘图区域. 由于<canvas> ...

  3. WebGL画点程序v3

    本文程序实现画一个点的任务,如下图.其中,点的颜色由Javascript传到片元着色器程序中. 整个程序包含两个文件,分别是: 1. HelloPoint3.html <!DOCTYPE HTM ...

  4. WebGL画点程序v2

    本文程序实现画一个点的任务,如下图.其中,点的位置坐标由Javascript传到着色器程序中,而不是直接给定("硬编码")在顶点着色器中. 整个程序包含两个文件,分别是: 1. H ...

  5. WebGL画点程序v1

    本文程序实现画一个点的任务,如下图.其中,点的位置直接给定("硬编码")在顶点着色器中. 整个程序包含两个文件,分别是: 1. HelloPoint1.html <!DOCT ...

  6. WebGL入门教程(二)-webgl绘制三角形

    前面已经介绍过了webgl,WebGL入门教程(一)-初识webgl(http://www.cnblogs.com/bsman/p/6128447.html),也知道了如何绘制一个点,接下来就用web ...

  7. 有关于OpenGL、OpenGL ES、WebGL的小结

    转自原文 有关于OpenGL.OpenGL ES.WebGL的小结 一.   OpenGL简介 OpenGL(全写Open Graphics Library)是个定义了一个跨编程语言.跨平台的编程接口 ...

  8. 彻底理解webgl

    javascript很简单,核心点就一个: 一切皆对象. 简单又熟悉.呵呵 这么简单的一句话,理解后,你就掌握了js. 一切皆对象,函数也是对象,创建静态方法 fun.action, 创建实例:new ...

  9. WebGL的shader

    WebGL的shader(着色器)有2种:vertexShader(定点着色器)和 fragmentShader(片段着色器) 顶点着色器:定义点的位置.大小 片元着色器:定义画出来的物体的材质(颜色 ...

随机推荐

  1. Linux平台oracle 11g单实例 安装部署配置 快速参考

    1.重建主机的Oracle用户 组 统一规范 uid gid 以保证共享存储挂接或其他需求的权限规范 userdel -r oracle groupadd -g 7 oinstall groupadd ...

  2. 使用swagger作为restful api的doc文档生成

    初衷 记得以前写接口,写完后会整理一份API接口文档,而文档的格式如果没有具体要求的话,最终展示的文档则完全决定于开发者的心情.也许多点,也许少点.甚至,接口总是需要适应新需求的,修改了,增加了,这份 ...

  3. jQuery-1.9.1源码分析系列(三) Sizzle选择器引擎——编译原理

    这一节要分析的东东比较复杂,篇幅会比较大,也不知道我描述后能不能让人看明白.这部分的源码我第一次看的时候也比较吃力,现在重头看一遍,再分析一遍,看能否查缺补漏. 看这一部分的源码需要有一个完整的概念后 ...

  4. Linux下的解压命令小结

    Linux下常见的压缩包格式有5种:zip tar.gz tar.bz2 tar.xz tar.Z 其中tar是种打包格式,gz和bz2等后缀才是指代压缩方式:gzip和bzip2 filename. ...

  5. EntityFramework中的DbContext使用疑点说明

    1.DbContext怎么在Asp.mvc中使用? public class Repository { //实例化EF容器:有弊端.一个线程里可能会创建多个DbContext //DbContext ...

  6. 学C#之设计模式系列笔记(2)观察者模式

    一.借鉴说明 1.<Head First Design Patterns>(中文名<深入浅出设计模式>) 2.维基百科,观察者模式,https://zh.wikipedia.o ...

  7. Wireshark

    0. install Wireshark on Ubuntu 14 sudo apt-get install -y wireshark sudo addgroup -quiet -system wir ...

  8. 分布式搜索elasticsearch配置文件详解

    elasticsearch的config文件夹里面有两个配置文件:elasticsearch.yml和logging.yml,第一个是es的基本配置文件,第二个是日志配置文件,es也是使用log4j来 ...

  9. CString转换为LPSTR和LPSTR转化为CString

    一.CString转换为LPSTR 方法一: CString strFileName LPSTR lpstr - strFileName.GetBuffer(); strFileName.Releas ...

  10. 浅谈Angular的 $q, defer, promise

    浅谈Angular的 $q, defer, promise 时间 2016-01-13 00:28:00  博客园-原创精华区 原文  http://www.cnblogs.com/big-snow/ ...