zoukankan      html  css  js  c++  java
  • HTML5以及WebGL

    出处:http://www.cnblogs.com/jyli/archive/2010/07/25/1784902.html 
    作者:李嘉昱

    首先来看下HTML5提供的新特性

    • Web Socket 定义了一套API, 允许网页能够使用Web Socket协议来和远程主机进行双工通信。
    • Web Storage 定义了一套API, 能够在Web客户端以key-value的形式对数据进行持久化存储。
    • Web SQL 定义了一套API, 能够将数据存储在数据库,并使用类似SQL的方式进行查询。
    • Web Workers 定义了一套API,能够允许脚本运行于后台,进行类似于线程化的操作。
    • WebGl 定义了一套API, 能够允许在网页中使用类似于Open GL,实际上是一套基于OpenGL ES 2.0的3d图形API。这些API是通过HTML 5的canvas标签来使用的。

    从上面可以看出WebGl实际上是HTML5提供的新特征的一部分,通过Html5的canvas元素来展现。

    这样页面开发人员利用canvas标签就可以开辟出一片类似于div的区域,从而能够在这块区域中实现3d渲染,使用方式类似于普通OpenGL的使用方式。

    实际上,canvas标签也是在html5中出现的,最先开始支持的是2d图形绘制,现在又开始有了基于WebGl的3d绘制。

    游戏Quake II实现了基于WebGL的移植,这样通过浏览器就能够玩Quake这样的较大型3d游戏。

    实际上更确切的说Quake II是基于HTML5的游戏。

    下面是WebGL版Quake使用的到的HTML5技术要素:

    • WebGL用于3d渲染。
    • HTML Audio用于音频。
    • Local Storage API用于本地持久化存储。
    • Web Socket用于网络通信。

    当然,Quake能在Browser上运行,也是离不了JavaScript的。

    目前,HTML5已经得到了很大程度上的推动,虽然还是在草案阶段,但主流浏览器均对其采取积极支持态度。

    在最新的浏览器上已经可以看到很多HTML5的特性,Google和Apple是其中的重要推手。

    从HTML5的新特征和以及使用上来看,不难看出为何Google和Apple如此的热衷于HTML5。

    如果想亲自尝试一下在自己机子上Build,并且run一下的话,可以参考如下步骤

    http://code.google.com/p/quake2-gwt-port/wiki/BuildingAndRunning

    我在ubuntu上尝试了一下,并把步骤更清晰的记录如下:

    step 1
    sudo apt-get install mercurial
    sudo apt-get install vorbis-tools
    sudo apt-get install openjdk-6-jdk
    sudo apt-get install lame

    step 2
    hg clone https://quake2-gwt-port.googlecode.com/hg/ quake2-gwt-port
    cd quake2-gwt-port

    step 3
    ./build-dedicated-server (will build the tools and the client and server code).
        * If you run into memory issues, try export MAVEN_OPTS=-Xmx512m

    step 4
    ./install-resources (will download, unpack, and convert the original Quake II demo resources).
    cp -r maven-build/server/target/gwtquake/war/gwtquake war
        * Due to a glitch in our maven build files, you currently also need cp -r maven-build/server/target/gwtquake/war/gwtquake war. We are fixing this.


    step 5
    ./run-dedicated-server [port] (will run the local Quake II server).

    step 6
    ./chromium --enable-webgl

    step 7
    http://localhost:8080/GwtQuake.html
    Navigate to: http://localhost:8080/GwtQuake.html (or whatever port you specified to the server).

    记得使用chromium。

    另外不过不想这么麻烦的话,也可以直接去尝试在线版的,搜一下,应该有不少的,

    比如这个:http://tatari.se:8080/GwtQuake.html

    遇到什么问题,可参考http://playwebgl.com/games/quake-2-webgl/

    最后share一个使用Browser玩的Quake视频

     转载于:http://www.cnblogs.com/jyli/archive/2010/07/25/1784902.html 

    虚心学习、丰富自己
  • 相关阅读:
    [ASP.NET] 使用 ASP.NET SignalR 添加实时 Web
    [ORM] Entity Framework(2) CodeFirst进阶
    [ORM] Entity Framework(1) CodeFirst快速入门
    [C#] 谈谈异步编程async await
    [Solution] NPOI操作Excel
    消息队列二
    消息队列一
    redis成长之路——(七)
    redis成长之路——(六)
    redis成长之路——(五)
  • 原文地址:https://www.cnblogs.com/tkqq000/p/14826754.html
Copyright © 2011-2022 走看看