Class Index | File Index

Classes


Class g_SVG

generation of Scalable Vector Graphics
輔助繪圖的基本功能物件,生成 SVG 操作函數。
Defined in: SVG.origin.js.

Class Summary
Constructor Attributes Constructor Name and Description
 
g_SVG(_width, _height, _backgroundColor)
g_SVG 物件之 constructor。
設定 SVG document fragment 並將之插入網頁中。
Field Summary
Field Attributes Field Name and Description
 
包含了插入元件的原始資訊。
Use #addContain to add contains.
<static>  
default stroke width.
 
div
所插入之網頁元素
<static>  
g_SVG.idPrefix
所有造出 id 之 prefix
 
最後一個增加的 instance
 
最後一個增加的 definition
 
svg
SVG document fragment
Method Summary
Method Attributes Method Name and Description
 
addCircle(_r, _cx, _cy)
繪製圓形。
此函數利用 g_SVG.prototype.addEllipsePath 來畫簡單圓形。
 
addContain(_o, _type, propertyO)
增加插入的元件。
應該用 symbol
 
addDefs(_n)
增加 SVG 定義。
SVG 規範中聲明,SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前,需要先在本物件中作定義。
 
addEllipse(_rx, _ry, _cx, _cy)
繪製簡單圓形/橢圓。
此函數利用 g_SVG.prototype.addEllipsePath 來畫簡單橢圓。
 
addEllipsePath(_rx, _ry, _cx, _cy, _color, _strokeWidth, _fill, tramA)
繪製橢圓曲線。
此函數利用 g_SVG.createNode 造出橢圓曲線元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addLine(_left, _top, _width, _height, _color, _strokeWidth)
繪製直線。
此函數利用 g_SVG.createNode 造出直線元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addNode(_n, _a, _i)
增加 SVG element。
結合 g_SVG.prototype.addDefs 與 g_SVG.prototype.addUse,作完定義後隨即使用之。
 
addPath(_d, _color, _strokeWidth, _fill)
繪製曲線路徑。
此函數利用 g_SVG.createNode 造出路徑元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addPolyline(_pA, _color, _strokeWidth, _fill, tramA)
繪製多邊形。
此函數利用 g_SVG.createNode 造出多邊形路徑元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addQuadrilateral(_ds, _h, _d, _us, tramA)
畫簡單長方形或平行四邊形、梯形
 
addRect(_w, _h, _x, _y, _color, _strokeWidth, _fill, tramA)
繪製矩形。
此函數利用 g_SVG.createNode 造出矩形路徑元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addText(_text, _left, _baseLine, _color, _font)
添加文字。
此函數利用 g_SVG.createNode 造出文字元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
 
addTriangle(_ds, _h, _d, tramA)
畫簡單三角形
 
addUse(_i, _a)
增加 SVG 實例。
利用本物件中之定義創建實例並增添至本物件中。
在裝載 b.svg 時,將 a.svg 中的 defs 中的圖元裝載到 b.svg 中(文件上是兩者是保持獨立的,但在內存中將二者合二為一),這樣就可以在b.svg中直接引用這些圖元了。
SVG 規範中聲明,SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前,需要先在本物件中作定義。
 
綁定 SVG elements 至本物件群組。
這函數將已存在的 SVG elements 綁定至本物件之群組中。若群組不存在,則創建出一個。
<private> <static>  
g_SVG.createENS(_ns, _qn, _a, _i)
create SVG document fragment (only for g_SVG.createNode)
 
createGroup(_a, _i)
創建本物件之 SVG 群組。
利用 SVG 群組我們可以同時操作多個 SVG elements。
<private> <static>  
g_SVG.createNode(_nodeN, _a, _i)
create SVG document fragment 元件(component)。
SVG 之 document fragment 與 HTML 不同 namespace,因此我們需要使用到 http://www.w3.org/2000/svg 來作為 XML elements 的 namespace。為了未來的兼容性,我們將這個功能獨立出來。
<private> <static>  
g_SVG.getRandomID(_t)
get a random ID to use.
<private> <static>  
g_SVG.setRandomID(_n)
give a random ID to the specified node.
 
show(_v)
顯現 this g_SVG
Class Detail
g_SVG(_width, _height, _backgroundColor)
g_SVG 物件之 constructor。
設定 SVG document fragment 並將之插入網頁中。
Parameters:
{int} _width
width of the canvas
{int} _height
height of the canvas
{color string} _backgroundColor Optional
background color of the canvas (UNDO)
Deprecated:
Use toolkit listed below instead:
svgweb
Scour
Since:
2006/12/7,10-12
Returns:
g_SVG object created
Requires:
setA,createE,removeAllChild//removeNode
See:
Scalable Vector Graphics (SVG) 1.1 Specification
SVG 1.1 reference with examples
Introduction and Features of JavaScript "Function" Objects
Volity Wiki: SVG Script Tricks
Javascript SVG et DOM
Field Detail
{Array} contains
包含了插入元件的原始資訊。
Use #addContain to add contains.

<static> {number} g_SVG.defaultStrokeWidth
default stroke width. 單位: px

div
所插入之網頁元素

<static> {string} g_SVG.idPrefix
所有造出 id 之 prefix

lastAdd
最後一個增加的 instance

lastAddDefs
最後一個增加的 definition

svg
SVG document fragment
See:
Defining an SVG document fragment: the 'svg' element
Method Detail
addCircle(_r, _cx, _cy)
繪製圓形。
此函數利用 g_SVG.prototype.addEllipsePath 來畫簡單圓形。
Parameters:
_r
_cx
_cy
Returns:

addContain(_o, _type, propertyO)
增加插入的元件。
應該用 symbol
Parameters:
_o
object reference
_type
type of this component
propertyO Optional
other properties
Returns:

addDefs(_n)
增加 SVG 定義。
SVG 規範中聲明,SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前,需要先在本物件中作定義。
Parameters:
_n
node
Returns:

addEllipse(_rx, _ry, _cx, _cy)
繪製簡單圓形/橢圓。
此函數利用 g_SVG.prototype.addEllipsePath 來畫簡單橢圓。
Parameters:
_rx
_ry
_cx
_cy
Returns:

addEllipsePath(_rx, _ry, _cx, _cy, _color, _strokeWidth, _fill, tramA)
繪製橢圓曲線。
此函數利用 g_SVG.createNode 造出橢圓曲線元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
_rx
_ry
_cx
_cy
_color
_strokeWidth
_fill
tramA
Returns:

addLine(_left, _top, _width, _height, _color, _strokeWidth)
繪製直線。
此函數利用 g_SVG.createNode 造出直線元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
_left
_top
_width
_height
_color
_strokeWidth
Returns:

addNode(_n, _a, _i)
增加 SVG element。
結合 g_SVG.prototype.addDefs 與 g_SVG.prototype.addUse,作完定義後隨即使用之。
Parameters:
_n
tagName(nodeType)
{hash|string} _a
attribute/property
_i
inner object
Returns:

addPath(_d, _color, _strokeWidth, _fill)
繪製曲線路徑。
此函數利用 g_SVG.createNode 造出路徑元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
_d
_color
_strokeWidth
_fill
Returns:

addPolyline(_pA, _color, _strokeWidth, _fill, tramA)
繪製多邊形。
此函數利用 g_SVG.createNode 造出多邊形路徑元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
{int array} _pA
[x1,y1,x2,y2,x3,y3,..]
_color
_strokeWidth
_fill
tramA
Returns:

addQuadrilateral(_ds, _h, _d, _us, tramA)
畫簡單長方形或平行四邊形、梯形
Parameters:
_ds
_h
_d
_us
tramA
Returns:
See:
平行四邊形

addRect(_w, _h, _x, _y, _color, _strokeWidth, _fill, tramA)
繪製矩形。
此函數利用 g_SVG.createNode 造出矩形路徑元件之後,再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
_w
_h
_x
_y
_color
_strokeWidth
_fill
tramA
Returns:

addText(_text, _left, _baseLine, _color, _font)
添加文字。
此函數利用 g_SVG.createNode 造出文字元件之後再用 g_SVG.prototype.addNode 將之插入本物件中。
Parameters:
_text
_left
_baseLine
_color
_font
Returns:

addTriangle(_ds, _h, _d, tramA)
畫簡單三角形
Parameters:
_ds
_h
_d
tramA
Since:
2006/12/17 12:38
Returns:

addUse(_i, _a)
增加 SVG 實例。
利用本物件中之定義創建實例並增添至本物件中。
在裝載 b.svg 時,將 a.svg 中的 defs 中的圖元裝載到 b.svg 中(文件上是兩者是保持獨立的,但在內存中將二者合二為一),這樣就可以在b.svg中直接引用這些圖元了。
SVG 規範中聲明,SVG 的 <use> element 不能引用外部文件或其 elements。因此我們在創建實例之前,需要先在本物件中作定義。
Parameters:
_i
id
_a
Returns:

attachGroup(_n)
綁定 SVG elements 至本物件群組。
這函數將已存在的 SVG elements 綁定至本物件之群組中。若群組不存在,則創建出一個。
Parameters:
_n
node
Returns:
this g_SVG

<private> <static> g_SVG.createENS(_ns, _qn, _a, _i)
create SVG document fragment (only for g_SVG.createNode)
Parameters:
_ns
_qn
_a
_i

createGroup(_a, _i)
創建本物件之 SVG 群組。
利用 SVG 群組我們可以同時操作多個 SVG elements。
Parameters:
{hash|string} _a
attribute/property
_i
inner object
Returns:
this g_SVG

<private> <static> g_SVG.createNode(_nodeN, _a, _i)
create SVG document fragment 元件(component)。
SVG 之 document fragment 與 HTML 不同 namespace,因此我們需要使用到 http://www.w3.org/2000/svg 來作為 XML elements 的 namespace。為了未來的兼容性,我們將這個功能獨立出來。
Parameters:
_nodeN
node/tag name
{hash|string} _a
attribute/property
_i
inner object
Returns:
node created or null

<private> <static> g_SVG.getRandomID(_t)
get a random ID to use.
Parameters:
_t
tag name(nodeType)
Returns:
a random ID

<private> <static> g_SVG.setRandomID(_n)
give a random ID to the specified node.
Parameters:
_n
node
Returns:
id of the specified node

show(_v)
顯現 this g_SVG
Parameters:
_v
visible
Returns:
this g_SVG

Documentation generated by JsDoc Toolkit 2.3.2 on Thu Dec 03 2009 11:02:57 GMT+0800 (CST)