mirror of
https://scm.univ-tours.fr/22107988t/rappaurio-sae501_502.git
synced 2025-08-29 21:05:57 +02:00
3056 lines
69 KiB
HTML
3056 lines
69 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
||
<head>
|
||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||
<meta name="generator" content="JsDoc Toolkit" />
|
||
|
||
<title>JsDoc Reference - CeL.interact.integrate.SVG</title>
|
||
|
||
<style type="text/css">
|
||
/* default.css */
|
||
body
|
||
{
|
||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
|
||
width: 800px;
|
||
}
|
||
|
||
.header
|
||
{
|
||
clear: both;
|
||
background-color: #ccc;
|
||
padding: 8px;
|
||
}
|
||
|
||
h1
|
||
{
|
||
font-size: 150%;
|
||
font-weight: bold;
|
||
padding: 0;
|
||
margin: 1em 0 0 .3em;
|
||
}
|
||
|
||
hr
|
||
{
|
||
border: none 0;
|
||
border-top: 1px solid #7F8FB1;
|
||
height: 1px;
|
||
}
|
||
|
||
pre.code
|
||
{
|
||
display: block;
|
||
padding: 8px;
|
||
border: 1px dashed #ccc;
|
||
}
|
||
|
||
#index
|
||
{
|
||
margin-top: 24px;
|
||
float: left;
|
||
width: 160px;
|
||
position: absolute;
|
||
left: 8px;
|
||
background-color: #F3F3F3;
|
||
padding: 8px;
|
||
}
|
||
|
||
#content
|
||
{
|
||
margin-left: 190px;
|
||
width: 600px;
|
||
}
|
||
|
||
.classList
|
||
{
|
||
list-style-type: none;
|
||
padding: 0;
|
||
margin: 0 0 0 8px;
|
||
font-family: arial, sans-serif;
|
||
font-size: 1em;
|
||
overflow: auto;
|
||
}
|
||
|
||
.classList li
|
||
{
|
||
padding: 0;
|
||
margin: 0 0 8px 0;
|
||
}
|
||
|
||
.summaryTable { width: 100%; }
|
||
|
||
h1.classTitle
|
||
{
|
||
font-size:170%;
|
||
line-height:130%;
|
||
}
|
||
|
||
h2 { font-size: 110%; }
|
||
caption, div.sectionTitle
|
||
{
|
||
background-color: #7F8FB1;
|
||
color: #fff;
|
||
font-size:130%;
|
||
text-align: left;
|
||
padding: 2px 6px 2px 6px;
|
||
border: 1px #7F8FB1 solid;
|
||
}
|
||
|
||
div.sectionTitle { margin-bottom: 8px; }
|
||
.summaryTable thead { display: none; }
|
||
|
||
.summaryTable td
|
||
{
|
||
vertical-align: top;
|
||
padding: 4px;
|
||
border-bottom: 1px #7F8FB1 solid;
|
||
border-right: 1px #7F8FB1 solid;
|
||
}
|
||
|
||
/*col#summaryAttributes {}*/
|
||
.summaryTable td.attributes
|
||
{
|
||
border-left: 1px #7F8FB1 solid;
|
||
width: 140px;
|
||
text-align: right;
|
||
}
|
||
|
||
td.attributes, .fixedFont
|
||
{
|
||
line-height: 15px;
|
||
color: #002EBE;
|
||
font-family: "Courier New",Courier,monospace;
|
||
font-size: 13px;
|
||
}
|
||
|
||
.summaryTable td.nameDescription
|
||
{
|
||
text-align: left;
|
||
font-size: 13px;
|
||
line-height: 15px;
|
||
}
|
||
|
||
.summaryTable td.nameDescription, .description
|
||
{
|
||
line-height: 15px;
|
||
padding: 4px;
|
||
padding-left: 4px;
|
||
}
|
||
|
||
.summaryTable { margin-bottom: 8px; }
|
||
|
||
ul.inheritsList
|
||
{
|
||
list-style: square;
|
||
margin-left: 20px;
|
||
padding-left: 0;
|
||
}
|
||
|
||
.detailList {
|
||
margin-left: 20px;
|
||
line-height: 15px;
|
||
}
|
||
.detailList dt { margin-left: 20px; }
|
||
|
||
.detailList .heading
|
||
{
|
||
font-weight: bold;
|
||
padding-bottom: 6px;
|
||
margin-left: 0;
|
||
}
|
||
|
||
.light, td.attributes, .light a:link, .light a:visited
|
||
{
|
||
color: #777;
|
||
font-style: italic;
|
||
}
|
||
|
||
.fineprint
|
||
{
|
||
text-align: right;
|
||
font-size: 10px;
|
||
}
|
||
</style>
|
||
</head>
|
||
|
||
<body>
|
||
<!-- ============================== header ================================= -->
|
||
<!-- begin static/header.html -->
|
||
<div id="header">
|
||
</div>
|
||
<!-- end static/header.html -->
|
||
|
||
<!-- ============================== classes index ============================ -->
|
||
<div id="index">
|
||
<!-- begin publish.classesIndex -->
|
||
<div align="center"><a href="../index.html">Class Index</a>
|
||
| <a href="../files.html">File Index</a></div>
|
||
<hr />
|
||
<h2>Classes</h2>
|
||
<ul class="classList">
|
||
|
||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li>
|
||
|
||
<li><a href="../symbols/CeL.html">CeL</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.debug.html">CeL.application.debug</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.debug.log.html">CeL.application.debug.log</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.locale.html">CeL.application.locale</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.net.html">CeL.application.net</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.net.Ajax.html">CeL.application.net.Ajax</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.html">CeL.application.OS.Windows</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.file.html">CeL.application.OS.Windows.file</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.HTA.html">CeL.application.OS.Windows.HTA</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.job.html">CeL.application.OS.Windows.job</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.registry.html">CeL.application.OS.Windows.registry</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.OS.Windows.WMI.html">CeL.application.OS.Windows.WMI</a></li>
|
||
|
||
<li><a href="../symbols/CeL.application.storage.file.html">CeL.application.storage.file</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.html">CeL.data</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.check.html">CeL.data.check</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.code.API.html">CeL.data.code.API</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.code.compatibility.html">CeL.data.code.compatibility</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.code.reorganize.html">CeL.data.code.reorganize</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.CSV.html">CeL.data.CSV</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.math.html">CeL.data.math</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.math.Hamming.html">CeL.data.math.Hamming</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.math.polynomial.html">CeL.data.math.polynomial</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.math.quotient.html">CeL.data.math.quotient</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.native.html">CeL.data.native</a></li>
|
||
|
||
<li><a href="../symbols/CeL.data.XML.html">CeL.data.XML</a></li>
|
||
|
||
<li><a href="../symbols/CeL.env.html">CeL.env</a></li>
|
||
|
||
<li><a href="../symbols/CeL.interact.DOM.html">CeL.interact.DOM</a></li>
|
||
|
||
<li><a href="../symbols/CeL.interact.form.address.html">CeL.interact.form.address</a></li>
|
||
|
||
<li><a href="../symbols/CeL.interact.form.select_input.html">CeL.interact.form.select_input</a></li>
|
||
|
||
<li><a href="../symbols/CeL.interact.integrate.map.html">CeL.interact.integrate.map</a></li>
|
||
|
||
<li><a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a></li>
|
||
|
||
</ul>
|
||
<hr />
|
||
<!-- end publish.classesIndex -->
|
||
</div>
|
||
|
||
<div id="content">
|
||
<!-- ============================== class title ============================ -->
|
||
<h1 class="classTitle">
|
||
|
||
Class CeL.interact.integrate.SVG
|
||
</h1>
|
||
|
||
<!-- ============================== class summary ========================== -->
|
||
<p class="description">
|
||
|
||
|
||
|
||
generation of Scalable Vector Graphics<br/>
|
||
輔助繪圖的基本功能物件，生成 SVG 操作函數。
|
||
|
||
|
||
<br /><i>Defined in: </i> <a href="../symbols/src/D__USB_cgi-bin_lib_JS_interact_integrate_SVG.origin.js.html">SVG.origin.js</a>.
|
||
|
||
</p>
|
||
|
||
<!-- ============================== constructor summary ==================== -->
|
||
|
||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class CeL.interact.integrate.SVG.">
|
||
<caption>Class Summary</caption>
|
||
<thead>
|
||
<tr>
|
||
<th scope="col">Constructor Attributes</th>
|
||
<th scope="col">Constructor Name and Description</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="attributes"> </td>
|
||
<td class="nameDescription" >
|
||
<div class="fixedFont">
|
||
<b><a href="../symbols/CeL.interact.integrate.SVG.html#constructor">CeL.interact.integrate.SVG</a></b>(_width, _height, _backgroundColor)
|
||
</div>
|
||
<div class="description">module SVG 物件之 constructor。<br/>
|
||
設定 SVG document fragment 並將之插入網頁中。</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
|
||
<!-- ============================== properties summary ===================== -->
|
||
|
||
|
||
|
||
<table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class CeL.interact.integrate.SVG.">
|
||
<caption>Field Summary</caption>
|
||
<thead>
|
||
<tr>
|
||
<th scope="col">Field Attributes</th>
|
||
<th scope="col">Field Name and Description</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#lastAdd">_#lastAdd</a></b>
|
||
</div>
|
||
<div class="description">最後一個增加的 instance</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#lastAddDefs">_#lastAddDefs</a></b>
|
||
</div>
|
||
<div class="description">最後一個增加的 definition</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
<b><a href="../symbols/CeL.interact.integrate.SVG.html#contains">contains</a></b>
|
||
</div>
|
||
<div class="description">包含了插入元件的原始資訊。<br/>
|
||
Use #addContain to add contains.</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.defaultStrokeWidth">defaultStrokeWidth</a></b>
|
||
</div>
|
||
<div class="description">default stroke width.</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
<b><a href="../symbols/CeL.interact.integrate.SVG.html#div">div</a></b>
|
||
</div>
|
||
<div class="description">所插入之網頁元素</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.idPrefix">idPrefix</a></b>
|
||
</div>
|
||
<div class="description">所有造出 id 之 prefix</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">
|
||
<b><a href="../symbols/CeL.interact.integrate.SVG.html#svg">svg</a></b>
|
||
</div>
|
||
<div class="description">SVG document fragment</div>
|
||
</td>
|
||
</tr>
|
||
|
||
</tbody>
|
||
</table>
|
||
|
||
|
||
|
||
|
||
|
||
<!-- ============================== methods summary ======================== -->
|
||
|
||
|
||
|
||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class CeL.interact.integrate.SVG.">
|
||
<caption>Method Summary</caption>
|
||
<thead>
|
||
<tr>
|
||
<th scope="col">Method Attributes</th>
|
||
<th scope="col">Method Name and Description</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addCircle">_#addCircle</a></b>(_r, _cx, _cy)
|
||
</div>
|
||
<div class="description">繪製圓形。<br/>
|
||
此函數利用 _.type.addEllipsePath 來畫簡單圓形。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addContain">_#addContain</a></b>(_o, _type, propertyO)
|
||
</div>
|
||
<div class="description">增加插入的元件。<br/>
|
||
應該用 <a href="http://www.w3.org/TR/SVG/struct.html#SymbolElement">symbol</a></div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addDefs">_#addDefs</a></b>(_n)
|
||
</div>
|
||
<div class="description">增加 SVG 定義。<br/>
|
||
SVG 規範中聲明，SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前，需要先在本物件中作定義。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addEllipse">_#addEllipse</a></b>(_rx, _ry, _cx, _cy)
|
||
</div>
|
||
<div class="description">繪製簡單圓形/橢圓。<br/>
|
||
此函數利用 .prototype.addEllipsePath 來畫簡單橢圓。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addEllipsePath">_#addEllipsePath</a></b>(_rx, _ry, _cx, _cy, _color, _strokeWidth, _fill, tramA)
|
||
</div>
|
||
<div class="description">繪製橢圓曲線。<br/>
|
||
此函數利用 _.eNode 造出橢圓曲線元件之後，再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addLine">_#addLine</a></b>(_left, _top, _width, _height, _color, _strokeWidth)
|
||
</div>
|
||
<div class="description">繪製直線。<br/>
|
||
此函數利用 _.eNode 造出直線元件之後，再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addNode">_#addNode</a></b>(_n, _a, _i)
|
||
</div>
|
||
<div class="description">增加 SVG element。<br/>
|
||
結合 .prototype.addDefs 與 .prototype.addUse，作完定義後隨即使用之。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addPath">_#addPath</a></b>(_d, _color, _strokeWidth, _fill)
|
||
</div>
|
||
<div class="description">繪製曲線路徑。<br/>
|
||
此函數利用 _.eNode 造出路徑元件之後再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addPolyline">_#addPolyline</a></b>(_pA, _color, _strokeWidth, _fill, tramA)
|
||
</div>
|
||
<div class="description">繪製多邊形。<br/>
|
||
此函數利用 _.eNode 造出多邊形路徑元件之後再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addQuadrilateral">_#addQuadrilateral</a></b>(_ds, _h, _d, _us, tramA)
|
||
</div>
|
||
<div class="description">畫簡單長方形或平行四邊形、梯形</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addRect">_#addRect</a></b>(_w, _h, _x, _y, _color, _strokeWidth, _fill, tramA)
|
||
</div>
|
||
<div class="description">繪製矩形。<br/>
|
||
此函數利用 _.eNode 造出矩形路徑元件之後，再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addText">_#addText</a></b>(_text, _left, _baseLine, _color, _font)
|
||
</div>
|
||
<div class="description">添加文字。<br/>
|
||
此函數利用 _.eNode 造出文字元件之後再用 .prototype.addNode 將之插入本物件中。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addTriangle">_#addTriangle</a></b>(_ds, _h, _d, tramA)
|
||
</div>
|
||
<div class="description">畫簡單三角形</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#addUse">_#addUse</a></b>(_i, _a)
|
||
</div>
|
||
<div class="description">增加 SVG 實例。<br/>
|
||
利用本物件中之定義創建實例並增添至本物件中。<br/>
|
||
在裝載 b.svg 時，將 a.svg 中的 defs 中的圖元裝載到 b.svg 中（文件上是兩者是保持獨立的，但在內存中將二者合二為一），這樣就可以在b.svg中直接引用這些圖元了。<br/>
|
||
SVG 規範中聲明，SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前，需要先在本物件中作定義。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#attachGroup">_#attachGroup</a></b>(_n)
|
||
</div>
|
||
<div class="description">綁定 SVG elements 至本物件群組。<br/>
|
||
這函數將已存在的 SVG elements 綁定至本物件之群組中。若群組不存在，則創建出一個。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#clean">_#clean</a></b>()
|
||
</div>
|
||
<div class="description">清除 canvas<br/>
|
||
很可能會出問題!</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#createGroup">_#createGroup</a></b>(_a, _i)
|
||
</div>
|
||
<div class="description">創建本物件之 SVG 群組。<br/>
|
||
利用 SVG 群組我們可以同時操作多個 SVG elements。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#setSize">_#setSize</a></b>(_width, _height)
|
||
</div>
|
||
<div class="description">調整 canvas 大小</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#._#show">_#show</a></b>(_v)
|
||
</div>
|
||
<div class="description">顯現 this module SVG object</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.changeText">changeText</a></b>(text_node, text)
|
||
</div>
|
||
<div class="description">改變 text</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><private> <static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.createENS">createENS</a></b>(_ns, _qn, _a, _i)
|
||
</div>
|
||
<div class="description">create SVG document fragment (only for .createNode)</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><private> <static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.createNode">createNode</a></b>(_nodeN, _a, _i)
|
||
</div>
|
||
<div class="description">create SVG document fragment 元件(component)。<br/>
|
||
SVG 之 document fragment 與 HTML 不同 namespace，因此我們需要使用到 <a href="http://www.w3.org/2000/svg">http://www.w3.org/2000/svg</a> 來作為 XML elements 的 namespace。為了未來的兼容性，我們將這個功能獨立出來。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_addition">draw_addition</a></b>(num1, num2, svgO, _color, _font)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來演示直式加法。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_circle">draw_circle</a></b>(_r, svgO, _color, _fill)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
繪製圓形。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_ellipse">draw_ellipse</a></b>(_rx, _ry, svgO, _color, _fill)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
繪製橢圓。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_long_division">draw_long_division</a></b>(dividend, divisor, digits_after, svgO, _color, _font)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來展示<a href="http://en.wikipedia.org/wiki/Long_division" title="long division">直式除法</a>。<br/>
|
||
!! 尚有許多 bug<br/></div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_multiplication">draw_multiplication</a></b>(num1, num2, svgO, _color, _font)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來演示直式乘法。<br/>
|
||
TODO: 小數的乘法</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_quadrilateral">draw_quadrilateral</a></b>(_ds, _h, _d, _us, svgO, _color, _fill)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
畫簡單梯形。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_subtraction">draw_subtraction</a></b>(num1, num2, svgO, _color, _font)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
呼叫 draw_subtraction 來演示直式減法。因為直式加減法的運算與機制過程非常相似，因此我們以 draw_addition 來一併的處理這兩個相似的運算過程。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.draw_triangle">draw_triangle</a></b>(_ds, _h, _d, svgO, _color, _fill)
|
||
</div>
|
||
<div class="description">use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
畫簡單三角形。</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><private> <static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.getNodeById">getNodeById</a></b>(id)
|
||
</div>
|
||
<div class="description">從 id 獲得 node</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><private> <static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.getRandomID">getRandomID</a></b>(tag)
|
||
</div>
|
||
<div class="description">get a random ID to use.</div>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="attributes"><private> <static> </td>
|
||
<td class="nameDescription">
|
||
<div class="fixedFont">CeL.interact.integrate.SVG.<b><a href="../symbols/CeL.interact.integrate.SVG.html#.setRandomID">setRandomID</a></b>(_n)
|
||
</div>
|
||
<div class="description">give a random ID to the specified node.</div>
|
||
</td>
|
||
</tr>
|
||
|
||
</tbody>
|
||
</table>
|
||
|
||
|
||
|
||
|
||
<!-- ============================== events summary ======================== -->
|
||
|
||
|
||
<!-- ============================== constructor details ==================== -->
|
||
|
||
<div class="details"><a name="constructor"> </a>
|
||
<div class="sectionTitle">
|
||
Class Detail
|
||
</div>
|
||
|
||
<div class="fixedFont">
|
||
<b>CeL.interact.integrate.SVG</b>(_width, _height, _backgroundColor)
|
||
</div>
|
||
|
||
<div class="description">
|
||
module SVG 物件之 constructor。<br/>
|
||
設定 SVG document fragment 並將之插入網頁中。
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{int}</span> <b>_width</b>
|
||
|
||
</dt>
|
||
<dd>width of the canvas</dd>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{int}</span> <b>_height</b>
|
||
|
||
</dt>
|
||
<dd>height of the canvas</dd>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{color String}</span> <b>_backgroundColor</b>
|
||
<i>Optional</i>
|
||
</dt>
|
||
<dd>background color of the canvas (UNDO)</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Deprecated:</dt>
|
||
<dt>
|
||
Use toolkit listed below instead:<br/>
|
||
<a href="http://code.google.com/p/svgweb/" accessdate="2009/11/15 16:34" title="svgweb - Project Hosting on Google Code">svgweb</a><br/>
|
||
<a href="https://launchpad.net/scour" accessdate="2009/11/15 16:35" title="Scour - Cleaning SVG Files in Launchpad">Scour</a>
|
||
</dt>
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/7,10-12</dd>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd><span class="light fixedFont">{<a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a>}</span> CeL.interact.integrate.SVG object created</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Requires:</dt>
|
||
|
||
<dd>set_attribute,XML_node,remove_all_child//removeNode</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">See:</dt>
|
||
|
||
<dd><a href="http://www.w3.org/TR/SVG/" accessdate="2009/11/15 16:31">Scalable Vector Graphics (SVG) 1.1 Specification</a><br/>
|
||
<a href="http://zvon.org/xxl/svgReference/Output/" accessdate="2009/11/15 16:31">SVG 1.1 reference with examples</a><br/>
|
||
<a href="http://www.permadi.com/tutorial/jsFunc/index.html" accessdate="2009/11/15 16:31" title="Introduction and Features of JavaScript "Function" Objects">Introduction and Features of JavaScript "Function" Objects</a><br/>
|
||
<a href="http://volity.org/wiki/index.cgi?SVG_Script_Tricks" accessdate="2009/11/15 16:31">Volity Wiki: SVG Script Tricks</a><br/>
|
||
<a href="http://pilat.free.fr/english/routines/js_dom.htm" accessdate="2009/11/15 16:31">Javascript SVG et DOM</a></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
<!-- ============================== field details ========================== -->
|
||
|
||
<div class="sectionTitle">
|
||
Field Detail
|
||
</div>
|
||
|
||
<a name="._#lastAdd"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#lastAdd</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
最後一個增加的 instance
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#lastAddDefs"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#lastAddDefs</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
最後一個增加的 definition
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="contains"> </a>
|
||
<div class="fixedFont">
|
||
|
||
<span class="light">{Array}</span>
|
||
<b>contains</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
包含了插入元件的原始資訊。<br/>
|
||
Use #addContain to add contains.
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".defaultStrokeWidth"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
<span class="light">{Number}</span>
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>defaultStrokeWidth</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
default stroke width. 單位: px
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="div"> </a>
|
||
<div class="fixedFont">
|
||
|
||
|
||
<b>div</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
所插入之網頁元素
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".idPrefix"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
<span class="light">{string}</span>
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>idPrefix</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
所有造出 id 之 prefix
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="svg"> </a>
|
||
<div class="fixedFont">
|
||
|
||
|
||
<b>svg</b>
|
||
|
||
</div>
|
||
<div class="description">
|
||
SVG document fragment
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">See:</dt>
|
||
|
||
<dd><a href="http://www.w3.org/TR/SVG/struct.html#NewDocument" accessdate="2009/11/15 16:53">Defining an SVG document fragment: the 'svg' element</a></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<!-- ============================== method details ========================= -->
|
||
|
||
<div class="sectionTitle">
|
||
Method Detail
|
||
</div>
|
||
|
||
<a name="._#addCircle"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addCircle</b>(_r, _cx, _cy)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製圓形。<br/>
|
||
此函數利用 _.type.addEllipsePath 來畫簡單圓形。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_r</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cy</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addContain"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addContain</b>(_o, _type, propertyO)
|
||
|
||
</div>
|
||
<div class="description">
|
||
增加插入的元件。<br/>
|
||
應該用 <a href="http://www.w3.org/TR/SVG/struct.html#SymbolElement">symbol</a>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_o</b>
|
||
|
||
</dt>
|
||
<dd>object reference</dd>
|
||
|
||
<dt>
|
||
<b>_type</b>
|
||
|
||
</dt>
|
||
<dd>type of this component</dd>
|
||
|
||
<dt>
|
||
<b>propertyO</b>
|
||
<i>Optional</i>
|
||
</dt>
|
||
<dd>other properties</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Requires:</dt>
|
||
|
||
<dd>split_String_to_Object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addDefs"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addDefs</b>(_n)
|
||
|
||
</div>
|
||
<div class="description">
|
||
增加 SVG 定義。<br/>
|
||
SVG 規範中聲明，SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前，需要先在本物件中作定義。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_n</b>
|
||
|
||
</dt>
|
||
<dd>node</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addEllipse"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addEllipse</b>(_rx, _ry, _cx, _cy)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製簡單圓形/橢圓。<br/>
|
||
此函數利用 .prototype.addEllipsePath 來畫簡單橢圓。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_rx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_ry</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cy</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addEllipsePath"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addEllipsePath</b>(_rx, _ry, _cx, _cy, _color, _strokeWidth, _fill, tramA)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製橢圓曲線。<br/>
|
||
此函數利用 _.eNode 造出橢圓曲線元件之後，再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_rx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_ry</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_cy</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_strokeWidth</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>tramA</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addLine"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addLine</b>(_left, _top, _width, _height, _color, _strokeWidth)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製直線。<br/>
|
||
此函數利用 _.eNode 造出直線元件之後，再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_left</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_top</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_width</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_height</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_strokeWidth</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addNode"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addNode</b>(_n, _a, _i)
|
||
|
||
</div>
|
||
<div class="description">
|
||
增加 SVG element。<br/>
|
||
結合 .prototype.addDefs 與 .prototype.addUse，作完定義後隨即使用之。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_n</b>
|
||
|
||
</dt>
|
||
<dd>tagName(nodeType)</dd>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{hash|string}</span> <b>_a</b>
|
||
|
||
</dt>
|
||
<dd>attribute/property</dd>
|
||
|
||
<dt>
|
||
<b>_i</b>
|
||
|
||
</dt>
|
||
<dd>inner object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addPath"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addPath</b>(_d, _color, _strokeWidth, _fill)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製曲線路徑。<br/>
|
||
此函數利用 _.eNode 造出路徑元件之後再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_d</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_strokeWidth</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addPolyline"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addPolyline</b>(_pA, _color, _strokeWidth, _fill, tramA)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製多邊形。<br/>
|
||
此函數利用 _.eNode 造出多邊形路徑元件之後再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{int array}</span> <b>_pA</b>
|
||
|
||
</dt>
|
||
<dd>[x1,y1,x2,y2,x3,y3,..]</dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_strokeWidth</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>tramA</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addQuadrilateral"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addQuadrilateral</b>(_ds, _h, _d, _us, tramA)
|
||
|
||
</div>
|
||
<div class="description">
|
||
畫簡單長方形或平行四邊形、梯形
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_ds</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_h</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_d</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_us</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>tramA</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">See:</dt>
|
||
|
||
<dd><a href="http://zh.wikipedia.org/wiki/%E5%B9%B3%E8%A1%8C%E5%9B%9B%E8%BE%B9%E5%BD%A2">平行四邊形</a></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addRect"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addRect</b>(_w, _h, _x, _y, _color, _strokeWidth, _fill, tramA)
|
||
|
||
</div>
|
||
<div class="description">
|
||
繪製矩形。<br/>
|
||
此函數利用 _.eNode 造出矩形路徑元件之後，再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_w</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_h</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_x</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_y</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_strokeWidth</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>tramA</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addText"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addText</b>(_text, _left, _baseLine, _color, _font)
|
||
|
||
</div>
|
||
<div class="description">
|
||
添加文字。<br/>
|
||
此函數利用 _.eNode 造出文字元件之後再用 .prototype.addNode 將之插入本物件中。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_text</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_left</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_baseLine</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_font</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addTriangle"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addTriangle</b>(_ds, _h, _d, tramA)
|
||
|
||
</div>
|
||
<div class="description">
|
||
畫簡單三角形
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_ds</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_h</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_d</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>tramA</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/17 12:38</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#addUse"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#addUse</b>(_i, _a)
|
||
|
||
</div>
|
||
<div class="description">
|
||
增加 SVG 實例。<br/>
|
||
利用本物件中之定義創建實例並增添至本物件中。<br/>
|
||
在裝載 b.svg 時，將 a.svg 中的 defs 中的圖元裝載到 b.svg 中（文件上是兩者是保持獨立的，但在內存中將二者合二為一），這樣就可以在b.svg中直接引用這些圖元了。<br/>
|
||
SVG 規範中聲明，SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前，需要先在本物件中作定義。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_i</b>
|
||
|
||
</dt>
|
||
<dd>id</dd>
|
||
|
||
<dt>
|
||
<b>_a</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#attachGroup"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#attachGroup</b>(_n)
|
||
|
||
</div>
|
||
<div class="description">
|
||
綁定 SVG elements 至本物件群組。<br/>
|
||
這函數將已存在的 SVG elements 綁定至本物件之群組中。若群組不存在，則創建出一個。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_n</b>
|
||
|
||
</dt>
|
||
<dd>node</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>this module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#clean"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#clean</b>()
|
||
|
||
</div>
|
||
<div class="description">
|
||
清除 canvas<br/>
|
||
很可能會出問題!
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2009/12/18 21:17:09</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>this SVG</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#createGroup"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#createGroup</b>(_a, _i)
|
||
|
||
</div>
|
||
<div class="description">
|
||
創建本物件之 SVG 群組。<br/>
|
||
利用 SVG 群組我們可以同時操作多個 SVG elements。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{hash|string}</span> <b>_a</b>
|
||
|
||
</dt>
|
||
<dd>attribute/property</dd>
|
||
|
||
<dt>
|
||
<b>_i</b>
|
||
|
||
</dt>
|
||
<dd>inner object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>this SVG</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#setSize"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#setSize</b>(_width, _height)
|
||
|
||
</div>
|
||
<div class="description">
|
||
調整 canvas 大小
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{Integer}</span> <b>_width</b>
|
||
|
||
</dt>
|
||
<dd>width in px</dd>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{Integer}</span> <b>_height</b>
|
||
|
||
</dt>
|
||
<dd>height in px</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>this module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name="._#show"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>_#show</b>(_v)
|
||
|
||
</div>
|
||
<div class="description">
|
||
顯現 this module SVG object
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_v</b>
|
||
|
||
</dt>
|
||
<dd>visible</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>this module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".changeText"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>changeText</b>(text_node, text)
|
||
|
||
</div>
|
||
<div class="description">
|
||
改變 text
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>text_node</b>
|
||
|
||
</dt>
|
||
<dd>text object</dd>
|
||
|
||
<dt>
|
||
<b>text</b>
|
||
|
||
</dt>
|
||
<dd>change to this text</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">See:</dt>
|
||
|
||
<dd><a href="http://www.w3.org/TR/SVG/text.html" accessdate="2009/12/15 0:2">Text - SVG 1.1 - 20030114</a>
|
||
<tref xlink:href="#ReferencedText"/></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".createENS"> </a>
|
||
<div class="fixedFont"><private> <static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>createENS</b>(_ns, _qn, _a, _i)
|
||
|
||
</div>
|
||
<div class="description">
|
||
create SVG document fragment (only for .createNode)
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_ns</b>
|
||
|
||
</dt>
|
||
<dd>namespaceURI</dd>
|
||
|
||
<dt>
|
||
<b>_qn</b>
|
||
|
||
</dt>
|
||
<dd>qualifiedName</dd>
|
||
|
||
<dt>
|
||
<b>_a</b>
|
||
|
||
</dt>
|
||
<dd>propertyA</dd>
|
||
|
||
<dt>
|
||
<b>_i</b>
|
||
|
||
</dt>
|
||
<dd>innerObj</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".createNode"> </a>
|
||
<div class="fixedFont"><private> <static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>createNode</b>(_nodeN, _a, _i)
|
||
|
||
</div>
|
||
<div class="description">
|
||
create SVG document fragment 元件(component)。<br/>
|
||
SVG 之 document fragment 與 HTML 不同 namespace，因此我們需要使用到 <a href="http://www.w3.org/2000/svg">http://www.w3.org/2000/svg</a> 來作為 XML elements 的 namespace。為了未來的兼容性，我們將這個功能獨立出來。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_nodeN</b>
|
||
|
||
</dt>
|
||
<dd>node/tag name</dd>
|
||
|
||
<dt>
|
||
<span class="light fixedFont">{hash|string}</span> <b>_a</b>
|
||
|
||
</dt>
|
||
<dd>attribute/property</dd>
|
||
|
||
<dt>
|
||
<b>_i</b>
|
||
|
||
</dt>
|
||
<dd>inner object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>node created or null</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_addition"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_addition</b>(num1, num2, svgO, _color, _font)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來演示直式加法。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>num1</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>num2</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_font</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/26 17:47</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_circle"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_circle</b>(_r, svgO, _color, _fill)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
繪製圓形。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_r</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/19 18:05</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_ellipse"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_ellipse</b>(_rx, _ry, svgO, _color, _fill)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
繪製橢圓。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_rx</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_ry</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_long_division"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_long_division</b>(dividend, divisor, digits_after, svgO, _color, _font)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來展示<a href="http://en.wikipedia.org/wiki/Long_division" title="long division">直式除法</a>。<br/>
|
||
!! 尚有許多 bug<br/>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<pre class="code">// include module
|
||
CeL.use('net.SVG');
|
||
|
||
// way 1
|
||
var SVG_object = new CeL.SVG;
|
||
SVG_object.attach('panel_for_SVG').show(1);
|
||
CeL.draw_long_division(452, 34, SVG_object);
|
||
// You can also put here.
|
||
//SVG_object.attach('panel_for_SVG').show(1);
|
||
|
||
// way 2
|
||
var SVG_object = CeL.draw_long_division(100000, 7);
|
||
SVG_object.attach('panel_for_SVG').show(1);
|
||
|
||
// 另一次顯示
|
||
CeL.draw_long_division(100, 7, SVG_object);</pre>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>dividend</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>divisor</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>digits_after</b>
|
||
|
||
</dt>
|
||
<dd>TODO: 小數直式除法: 小數點後位數, how many digits after the decimal separator</dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_font</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/11-12 11:36</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_multiplication"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_multiplication</b>(num1, num2, svgO, _color, _font)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
利用 module SVG 物件來演示直式乘法。<br/>
|
||
TODO: 小數的乘法
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>num1</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>num2</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_font</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/26 17:47</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">See:</dt>
|
||
|
||
<dd><a href="http://203.71.239.19/math/courses/cs04/M4_6.php" accessdate="2010/1/20 18:5">小數篇：小數的乘法</a></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_quadrilateral"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_quadrilateral</b>(_ds, _h, _d, _us, svgO, _color, _fill)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
畫簡單梯形。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_ds</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_h</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_d</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_us</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/17 12:38</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Requires:</dt>
|
||
|
||
<dd>split_String_to_Object,set_attribute,XML_node,removeNode,remove_all_child,g_SVG,draw_quadrilateral</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_subtraction"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_subtraction</b>(num1, num2, svgO, _color, _font)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
呼叫 draw_subtraction 來演示直式減法。因為直式加減法的運算與機制過程非常相似，因此我們以 draw_addition 來一併的處理這兩個相似的運算過程。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>num1</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>num2</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_font</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/26 17:47</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".draw_triangle"> </a>
|
||
<div class="fixedFont"><static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>draw_triangle</b>(_ds, _h, _d, svgO, _color, _fill)
|
||
|
||
</div>
|
||
<div class="description">
|
||
use <a href="../symbols/CeL.interact.integrate.SVG.html">CeL.interact.integrate.SVG</a> to draw:
|
||
畫簡單三角形。
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_ds</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_h</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_d</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>svgO</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_color</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
<dt>
|
||
<b>_fill</b>
|
||
|
||
</dt>
|
||
<dd></dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Since:</dt>
|
||
<dd>2006/12/17 12:38</dd>
|
||
</dl>
|
||
</dl>
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>module SVG object</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Requires:</dt>
|
||
|
||
<dd>split_String_to_Object,set_attribute,XML_node,removeNode,remove_all_child,g_SVG,draw_triangle</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".getNodeById"> </a>
|
||
<div class="fixedFont"><private> <static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>getNodeById</b>(id)
|
||
|
||
</div>
|
||
<div class="description">
|
||
從 id 獲得 node
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>id</b>
|
||
|
||
</dt>
|
||
<dd>id</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>node</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".getRandomID"> </a>
|
||
<div class="fixedFont"><private> <static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>getRandomID</b>(tag)
|
||
|
||
</div>
|
||
<div class="description">
|
||
get a random ID to use.
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>tag</b>
|
||
|
||
</dt>
|
||
<dd>tag name(nodeType)</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>a random ID</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
<hr />
|
||
|
||
<a name=".setRandomID"> </a>
|
||
<div class="fixedFont"><private> <static>
|
||
|
||
|
||
<span class="light">CeL.interact.integrate.SVG.</span><b>setRandomID</b>(_n)
|
||
|
||
</div>
|
||
<div class="description">
|
||
give a random ID to the specified node.
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Parameters:</dt>
|
||
|
||
<dt>
|
||
<b>_n</b>
|
||
|
||
</dt>
|
||
<dd>node</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
<dl class="detailList">
|
||
<dt class="heading">Returns:</dt>
|
||
|
||
<dd>id of the specified node</dd>
|
||
|
||
</dl>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<!-- ============================== event details ========================= -->
|
||
|
||
|
||
<hr />
|
||
</div>
|
||
|
||
|
||
<!-- ============================== footer ================================= -->
|
||
<div class="fineprint" style="clear:both">
|
||
|
||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0 on Sat Aug 20 2011 15:07:31 GMT+0800 (CST)
|
||
</div>
|
||
</body>
|
||
</html>
|