Hilo/docs/api-zh/symbols/WebGLRenderer.html
2019-01-09 14:37:29 +08:00

812 lines
26 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="generator" content="JsDoc Toolkit"/>
<title>WebGLRenderer - Hilo API 参考文档</title>
<style>
iframe{
border:1px solid #333;
}
</style>
<link href="../../bootstrap3.0.3/css/bootstrap.min.css" rel="stylesheet">
<link href="../../bootstrap3.0.3/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="../../css/prettify.min.css" rel="stylesheet">
<link href="../../css/api.min.css" rel="stylesheet">
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
<span>Hilo</span><span></span>
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="//hiloteam.github.io/index.html">首页</a></li>
<li><a href="//github.com/hiloteam/Hilo" target="_blank">源码下载</a></li>
<li class="active"><a href="../index.html">API文档</a></li>
<li><a href="//hiloteam.github.io/tutorial/index.html">教程文档</a></li>
<li><a href="//hiloteam.github.io/examples/index.html">作品演示</a></li>
</u>
</div>
</div>
</div>
<div class="container main">
<div class="col-md-3">
<div class="bs-sidebar well">
<!-- <div class="hilo-header">类列表</div> -->
<ul class="nav bs-sidenav">
<li class="nav-pkg">core<span></span></li>
<li class="nav-class"><a href="../symbols/Class.html">Class</a></li>
<li class="nav-class"><a href="../symbols/Hilo.html">Hilo</a></li>
<li class="nav-pkg">event<span></span></li>
<li class="nav-class"><a href="../symbols/EventMixin.html">EventMixin</a></li>
<li class="nav-pkg">game<span></span></li>
<li class="nav-class"><a href="../symbols/Camera.html">Camera</a></li>
<li class="nav-class"><a href="../symbols/Camera3d.html">Camera3d</a></li>
<li class="nav-class"><a href="../symbols/ParticleSystem.html">ParticleSystem</a></li>
<li class="nav-pkg">geom<span></span></li>
<li class="nav-class"><a href="../symbols/Matrix.html">Matrix</a></li>
<li class="nav-pkg">loader<span></span></li>
<li class="nav-class"><a href="../symbols/LoadQueue.html">LoadQueue</a></li>
<li class="nav-pkg">media<span></span></li>
<li class="nav-class"><a href="../symbols/HTMLAudio.html">HTMLAudio</a></li>
<li class="nav-class"><a href="../symbols/WebAudio.html">WebAudio</a></li>
<li class="nav-class"><a href="../symbols/WebSound.html">WebSound</a></li>
<li class="nav-pkg">renderer<span></span></li>
<li class="nav-class"><a href="../symbols/CanvasRenderer.html">CanvasRenderer</a></li>
<li class="nav-class"><a href="../symbols/DOMRenderer.html">DOMRenderer</a></li>
<li class="nav-class"><a href="../symbols/Renderer.html">Renderer</a></li>
<li class="nav-class"><a href="../symbols/WebGLRenderer.html">WebGLRenderer</a></li>
<li class="nav-pkg">tween<span></span></li>
<li class="nav-class"><a href="../symbols/Ease.html">Ease</a></li>
<li class="nav-class"><a href="../symbols/Tween.html">Tween</a></li>
<li class="nav-pkg">util<span></span></li>
<li class="nav-class"><a href="../symbols/TextureAtlas.html">TextureAtlas</a></li>
<li class="nav-class"><a href="../symbols/Ticker.html">Ticker</a></li>
<li class="nav-class"><a href="../symbols/browser.html">browser</a></li>
<li class="nav-class"><a href="../symbols/drag.html">drag</a></li>
<li class="nav-class"><a href="../symbols/util.html">util</a></li>
<li class="nav-pkg">view<span></span></li>
<li class="nav-class"><a href="../symbols/Bitmap.html">Bitmap</a></li>
<li class="nav-class"><a href="../symbols/BitmapText.html">BitmapText</a></li>
<li class="nav-class"><a href="../symbols/Button.html">Button</a></li>
<li class="nav-class"><a href="../symbols/CacheMixin.html">CacheMixin</a></li>
<li class="nav-class"><a href="../symbols/Container.html">Container</a></li>
<li class="nav-class"><a href="../symbols/DOMElement.html">DOMElement</a></li>
<li class="nav-class"><a href="../symbols/Drawable.html">Drawable</a></li>
<li class="nav-class"><a href="../symbols/Graphics.html">Graphics</a></li>
<li class="nav-class"><a href="../symbols/Sprite.html">Sprite</a></li>
<li class="nav-class"><a href="../symbols/Stage.html">Stage</a></li>
<li class="nav-class"><a href="../symbols/Text.html">Text</a></li>
<li class="nav-class"><a href="../symbols/View.html">View</a></li>
</ul>
</div>
</div>
<div class="col-md-9">
<!-- ============================== class title ============================ -->
<h1 style="margin-top:0;">
WebGLRenderer
</h1><hr style="margin-top:10px;" />
<!-- ============================== class summary ========================== -->
<p class="description">
<span style="display:block;margin:0 0 2px 0;">
<b style="margin-right:10px;">继承</b> WebGLRenderer
<i class="glyphicon glyphicon-arrow-right"></i> <a href="../symbols/Renderer.html">Renderer</a>
</span>
<span style="display:block;margin:0 0 2px 0;">
<b style="margin-right:10px;">模块</b> hilo/renderer/WebGLRenderer
</span>
<span style="display:block;margin:0 0 2px 0;">
<b style="margin-right:10px;">依赖</b>
<span><a href="../symbols/Class.html">hilo/core/Class</a></span>, <span><a href="../symbols/Hilo.html">hilo/core/Hilo</a></span>, <span><a href="../symbols/Renderer.html">hilo/renderer/Renderer</a></span>, <span><a href="../symbols/Matrix.html">hilo/geom/Matrix</a></span>
</span>
<span style="display:block;margin:0 0 2px 0;">
<b style="margin-right:10px;">源码</b>
<a href="../symbols/src/docs_api-zh_code_renderer_WebGLRenderer.js.html">WebGLRenderer.js</a>
</span>
<br>
webgl画布渲染器。所有可视对象将渲染在canvas画布上。
</p>
<!-- ============================== properties summary ===================== -->
<div style="margin:30px 0 5px 0;">
<h3 style="display:inline;margin-right:10px;">属性概览</h3>
<a style="color:#666;text-decoration:none;cursor:pointer;" onclick="toggleProperties()"><i class="glyphicon glyphicon-circle-arrow-right" id="propToggleIcon"></i><span id="propToggleTip">显示继承属性</span></a>
</div>
<table class="table table-striped table-bordered table-condensed table-symbol" cellspacing="0">
<thead>
<tr>
<th scope="col"></th>
<th scope="col">属性</th>
<th scope="col">定义于</th>
</tr>
</thead>
<tbody>
<tr >
<td>
</td>
<td class="fixedFont">
<div>
<!-- -->
<b><a href="../symbols/WebGLRenderer.html#gl">gl</a></b>:WebGLRenderingContext
</div>
<div class="description">
webgl上下文。只读属性。
</div>
</td>
<td>
WebGLRenderer
</td>
</tr>
<tr >
<td>
</td>
<td class="fixedFont">
<div>
<!--
WebGLRenderer.
-->
<b><a href="../symbols/WebGLRenderer.html#.contextOptions">contextOptions</a></b>
</div>
<div class="description">
<span class="label">static</span>
WebGL context Options
</div>
</td>
<td>
WebGLRenderer
</td>
</tr>
<tr >
<td>
</td>
<td class="fixedFont">
<div>
<!--
WebGLRenderer.
-->
<b><a href="../symbols/WebGLRenderer.html#.MAX_BATCH_NUM">MAX_BATCH_NUM</a></b>
</div>
<div class="description">
<span class="label">static</span>
最大批渲染数量。
</div>
</td>
<td>
WebGLRenderer
</td>
</tr>
<tr >
<td>
</td>
<td class="fixedFont">
<div>
<!--
WebGLRenderer.
-->
<b><a href="../symbols/WebGLRenderer.html#.ATTRIBUTE_NUM">ATTRIBUTE_NUM</a></b>
</div>
<div class="description">
<span class="label">static</span>
顶点属性数。只读属性。
</div>
</td>
<td>
WebGLRenderer
</td>
</tr>
<tr class='inheritProp' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div>
<!-- -->
<b><a href="../symbols/Renderer.html#canvas">canvas</a></b>:Object
</div>
<div class="description">
渲染器对应的画布。它可能是一个普通的DOM元素比如div也可以是一个canvas画布元素。只读属性。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritProp' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div>
<!-- -->
<b><a href="../symbols/Renderer.html#renderType">renderType</a></b>:String
</div>
<div class="description">
渲染方式。只读属性。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritProp' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div>
<!-- -->
<b><a href="../symbols/Renderer.html#stage">stage</a></b>:Object
</div>
<div class="description">
渲染器对应的舞台。只读属性。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
function toggleProperties(){
var alink = $('#propToggleIcon');
if(alink.hasClass('glyphicon-circle-arrow-right')){
alink.removeClass('glyphicon-circle-arrow-right');
alink.addClass('glyphicon-circle-arrow-down');
$('#propToggleTip').html('隐藏继承属性');
$('.inheritProp').show();
}else{
alink.removeClass('glyphicon-circle-arrow-down');
alink.addClass('glyphicon-circle-arrow-right');
$('#propToggleTip').html('显示继承属性');
$('.inheritProp').hide();
}
}
</script>
<!-- ============================== methods summary ======================== -->
<div style="margin:30px 0 5px; 0">
<h3 style="display:inline;margin-right:10px;">方法概览</h3>
<a style="color:#666;text-decoration:none;cursor:pointer;" onclick="toggleMethods()"><i class="glyphicon glyphicon-circle-arrow-right" id="methodToggleIcon"></i><span id="methodToggleTip">显示继承方法</span></a>
</div>
<table class="table table-striped table-bordered table-condensed table-symbol" cellspacing="0">
<thead>
<tr>
<th scope="col"></th>
<th scope="col">方法</th>
<th scope="col">定义于</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td>
<div class="fixedFont">
<b><a href="#constructor">WebGLRenderer</a></b>(properties:Object)
</div>
<div class="description">构造函数</div>
</td>
<td>WebGLRenderer</td>
</tr>
<tr >
<td>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/WebGLRenderer.html#.isSupport">isSupport</a></b>()
</div>
<div class="description">
<span class="label">static</span>
是否支持WebGL。只读属性。
</div>
</td>
<td>
WebGLRenderer
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#clear">clear</a></b>(x:Number, y:Number, width:Number, height:Number)
</div>
<div class="description">
清除画布指定区域。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#draw">draw</a></b>(target:<a href="../symbols/View.html">View</a>)
</div>
<div class="description">
绘制可视对象。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#endDraw">endDraw</a></b>(target:<a href="../symbols/View.html">View</a>)
</div>
<div class="description">
结束绘制可视对象后的后续处理方法。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#hide">hide</a></b>()
</div>
<div class="description">
隐藏可视对象。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#remove">remove</a></b>(target:<a href="../symbols/View.html">View</a>)
</div>
<div class="description">
从画布中删除可视对象。注意不是从stage中删除对象。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#resize">resize</a></b>(width:Number, height:Number)
</div>
<div class="description">
改变渲染器的画布大小。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#startDraw">startDraw</a></b>(target:<a href="../symbols/View.html">View</a>)
</div>
<div class="description">
为开始绘制可视对象做准备。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
<tr class='inheritMethod' style='display:none;'>
<td>
<i class="icon-arrow-up" style="margin:12px 0 0 4px;"></i>
</td>
<td class="fixedFont">
<div><b><a href="../symbols/Renderer.html#transform">transform</a></b>()
</div>
<div class="description">
对可视对象进行变换。需要子类来实现。
</div>
</td>
<td>
<a href="../symbols/Renderer.html">Renderer</a>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
function toggleMethods(){
var alink = $('#methodToggleIcon');
if(alink.hasClass('glyphicon-circle-arrow-right')){
alink.removeClass('glyphicon-circle-arrow-right');
alink.addClass('glyphicon-circle-arrow-down');
$('#methodToggleTip').html('隐藏继承方法');
$('.inheritMethod').show();
}else{
alink.removeClass('glyphicon-circle-arrow-down');
alink.addClass('glyphicon-circle-arrow-right');
$('#methodToggleTip').html('显示继承方法');
$('.inheritMethod').hide();
}
}
</script>
<!-- ============================== field details ========================== -->
<br/>
<div class="">
<h3 style="margin-bottom:15px;">属性详情</h3>
</div>
<a class="anchor" name=".ATTRIBUTE_NUM"> </a>
<div class="member-box">
<div class="member-header">[Static]
<b>ATTRIBUTE_NUM</b>
</div>
<div class="description">
顶点属性数。只读属性。
</div>
</div>
<a class="anchor" name=".contextOptions"> </a>
<div class="member-box">
<div class="member-header">[Static]
<b>contextOptions</b>
</div>
<div class="description">
WebGL context Options
</div>
<dl class="detailList">
<dt class="heading">查看相关:</dt>
<dd>https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/getContextAttributes</dd>
</dl>
</div>
<a class="anchor" name="gl"> </a>
<div class="member-box">
<div class="member-header">
<b>gl</b><span class="light">:WebGLRenderingContext</span>
</div>
<div class="description">
webgl上下文。只读属性。
</div>
</div>
<a class="anchor" name=".MAX_BATCH_NUM"> </a>
<div class="member-box">
<div class="member-header">[Static]
<b>MAX_BATCH_NUM</b>
</div>
<div class="description">
最大批渲染数量。
</div>
</div>
<!-- ============================== constructor details ==================== -->
<br/>
<div class="details">
<a class="anchor" name="constructor"> </a>
<div class="">
<h3 style="margin-bottom:15px;">构造函数</h3>
</div>
<div class="member-box">
<div class="member-header">
<b>WebGLRenderer</b>(properties:Object)
</div>
<dl class="detailList">
<dt class="heading"><span class="label">parameters</span></dt>
<dt style="margin-left:20px;font-weight:normal;">
<b>properties</b>:<span>Object</span>
— 创建对象的属性参数。可包含此类所有可写属性。
</dt>
</dl>
</div>
</div>
<!-- ============================== method details ========================= -->
<br/>
<div class=""><h3 style="margin-bottom:15px;">方法详情</h3></div>
<a class="anchor" name=".isSupport"> </a>
<div class="member-box">
<div class="member-header">
[Static]
<b>isSupport</b>()
</div>
<div class="description">是否支持WebGL。只读属性。</div>
</div>
</div>
</div>
<footer class="col-md-12">
<hr>
<p>&copy; Hilo 2016</p>
</footer>
<script src="../../js/jquery.min.js"></script>
<script src="../../bootstrap3.0.3/js/bootstrap.min.js"></script>
<script src="../../js/prettify.min.js"></script>
<script type="text/javascript">
//make code pretty
$('pre').addClass('prettyprint linenums fixedFont');
window.prettyPrint && prettyPrint();
</script>
</body>
</html>