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. Java 序列化与反序列化

    1.什么是序列化?为什么要序列化? Java 序列化就是指将对象转换为字节序列的过程,而反序列化则是只将字节序列转换成目标对象的过程. 我们都知道,在进行浏览器访问的时候,我们看到的文本.图片.音频. ...

  2. .NET4.5新特性之异步编程(Async和Await)的使用

    一.简介 首先来看看.net的发展中的各个阶段的特性:NET 与C# 的每个版本发布都是有一个"主题".即:C#1.0托管代码→C#2.0泛型→C#3.0LINQ→C#4.0动态语 ...

  3. ListFragment的使用

    ListFragment继承了Fragment,顾名思义,ListFragment是一种特殊的Fragment,它包含了一个ListView,在ListView里面显示数据. 1. MainActiv ...

  4. 配置mac百度云同步盘

    1. 选择同步盘在电脑中的位置,该文件夹中的内容与云端保持一致.默认位置/Users/LemonVerbena/百度云同步盘.电脑同步盘的作用与百度云网盘的主页一样,下面可以包括多个同步文件夹. 2. ...

  5. stream_set_timeout (fread 造成了php程序timeout)

    最近在执行fread时候,php出现了 "Fatal error: Maximum execution time of 30 seconds " fread() :从文件指针 ha ...

  6. 设计模式-策略模式(Strategy Model)

    1.概述     在开发过程中常常会遇到类似问题,实现一个功能的时候往往有多种算法/方法(策略),我们可以根据环境的不同来使用不同的算法或策略来实现这一功能.     如在人物比较排序的实现中,我们有 ...

  7. H5 WebSocket 如何和C#进行通信

    HTML5作为下一代的 Web 标准, 拥有许多引人注目的新特性,如 Canvas.本地存储.多媒体编程接口.WebSocket 等.WebSocket 在浏览器和服务器之间提供了一个基于 TCP 连 ...

  8. 封装 用canvas绘制直线的函数--面向对象

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. CentOS7下安装Python的pip

    root用户使用yum install -y python-pip 时会报如下错误: No package python-pip available Error:Nothing to do 解决方法如 ...

  10. SDK接入(3)之iOS内支付(In-App Purchase)接入

    SDK接入(3)之iOS内支付(In-App Purchase)接入 继整理了Android平台的SDK接入过程.再来分享下iOS平台的内支付(In-App Purchase)接入,作为笔者在游戏开发 ...