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. CSS3与页面布局学习总结(四)——页面布局大全

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

  2. 基於tiny4412的Linux內核移植--- 中斷和GPIO學習(3)

    作者 彭東林 pengdonglin137@163.com 平臺 tiny4412 ADK Linux-4.4.4 u-boot使用的U-Boot 2010.12,是友善自帶的,爲支持設備樹和uIma ...

  3. 《Head First 设计模式》之策略模式

    作者:Grey 原文地址:http://www.cnblogs.com/greyzeng/p/5915202.html 模式名称 策略模式(Strategy Pattern) 需求 模拟鸭子游戏,游戏 ...

  4. 『.NET Core CLI工具文档』(十一)dotnet-test

    说明:本文是个人翻译文章,由于个人水平有限,有不对的地方请大家帮忙更正. 原文:dotnet-test 翻译:dotnet-test 名称 dotnet-test - 使用配置的测试运行器运行单元测试 ...

  5. 翻译:使用 ASP.NET MVC 4, EF, Knockoutjs and Bootstrap 设计和开发站点 - 1

    原文地址:http://ddmvc4.codeplex.com/ 原文名称:Design and Develop a website using ASP.NET MVC 4, EF, Knockout ...

  6. Bonobo创建新库出错,解决方案

    创建新库出错如下: Native library pre-loader is trying to load native SQLite library "D:\wwwroot\localho ...

  7. Delphi_03_Delphi_Object_Pascal_基本语法_01

    这次是一个基本语法的第一部分,包括变量.变量初始化.常量.运算符.字符串等内容. { 本程序演示 Delphi Pascal 的基本语法 1.变量及变量的初始化 2.常量 3.运算符 3. 4. } ...

  8. axis2+struts拦截地址冲突问题

    axis2和struts在整合过程中,struts会把axis的地址也拦截了,默认当成一个action处理, 会因为找不到action而报错: <!-- struts配置 --> < ...

  9. 怎样在asp中产生10个0-99的随机数

    <% randomize for i=1 to 10 response.write cint(rnd*100) next %> randomize是随机初始化,使用rnd之前必须要先来一句 ...

  10. CSS代码规范

    空格 选择器 与 { 之间必须包含空格. 列表型属性值 书写在单行时,, 后必须跟一个空格. 属性名 与之后的 : 之间不允许包含空格, : 与 属性值 之间必须包含空格. margin: 0; .+ ...