http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
http://www.w3.org/1999/xhtml">
smipleChart
（函數（文檔，未定義）{
var win = 這個，
uuuid = -1,
hasSVG = win.SVGAngle || doc.implementation.hasFeature("
http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1"),
,
isIE = /msie/i.test(navigator.userAgent) && !win.opera,
路徑 = hasSVG?'d':'路徑',
seal = hasSVG?'z':'e',
數學 = 數學，
mathRound = math.round,
mathFloor = math.floor,
mathCeil = math.ceil,
mathMax = math.max,
mathMin = math.min,
mathAbs = math.abs,
mathCos = math.cos，
mathSin = math.sin,
M = 'M',
L = 'L';
win.$$ = 函數(Id){
return document.getElementById(Id);
};
win.extend = function(){
var 目標 = 參數[0] || {}, i = 1, length = argument.length, deep = true, options;
if ( typeof target === "boolean" ) {
深度=目標；
目標=參數[1] || {};
我 = 2;
}
if ( typeof target !== "object" && Object.prototype.toString.call(target)!="[object Function]")
目標 = {};
for(;i
if ( (options = argument[ i ]) != null )
for(選項中的變數名稱){
var src = target[ name ], copy = options[ name ];
if ( 目標 === 複製 )
繼續；
if ( deep && copy && typeof copy === "object" && !copy.nodeType ){
target[ name ] = argument.callee( deep, src || ( copy.length != null ? [ ] : { } ), copy );
}
else if(複製！==未定義)
目標[姓名]=複製；
}
}
返回目標；
};
win.each = 函數（物件、回呼、參數）{
var name, i = 0, length = object.length;
if ( args ) {
args = Array.prototype.slice.call(arguments).slice(2);
if ( 長度 === 未定義 ) {
for (物件中的名稱)
if (callback.apply(object[ name ],[name,object[ name ]].concat(args) ) === false )
休息;
} 其他
for ( ; i
if (callback.apply( object[ i ],[i,object[ i ]].concat(args)) === false ) //
休息;
} 其他 {
if ( 長度 === 未定義 ) {
for (物件中的名稱)
if (callback.call(object[ name ], name, object[ name ] ) === false )
休息;
} 其他
for ( var value = object[0];
我
}
回傳對象；
};
win.contains = function(p,c){
if(!p||!c)回傳 false;
if(p===c)回傳 true;
返回是IE
？ p.contains(c)
: p.compareDocumentPosition(c)==20
？是的
：假；
};
//------------------------------------------------ ---------------
函數 processPoint( x ){ 返回是IE？ ~~x.toFixed(0) : ~~x.toFixed(0) 0.5;
};
函數 calTextLen(txt, cssStr){
var span = doc.createElement('span');
if(cssStr){
typeof cssStr === '字串'
？ span.style.cssText = cssStr
: 擴充(span.style,cssStr);
}其他{
擴充（span.style，{
字體大小 : '12px',
fontFamily : '「Lucida Grande」、「Lucida Sans Unicode」、Verdana、Arial、Helvetica、sans-serif'
});
}
span.innerHTML = txt || '';
span.style.visibility = '隱藏';
doc.body.appendChild(span);
var width = span.offsetWidth,
高度 = span.offsetHeight;
doc.body.removeChild(span);
return {w:寬度,h:高度};
};
函數角度(r,center,o,jingdu){
var hudu = Math.PI*2*(o/360),
x = center[0] r*Math.sin(hudu),
y = center[1] -r*Math.cos(hudu);
返回[x.toFixed(jingdu||0),y.toFixed(jingdu||0)];
}
函數 xx(a,b,lineNum){
var t = 1000,
stf = ((b*t-a*t)/lineNum)/t,
arr = [1,2,2.5,5,10],
c = 1，
v;
// 分割線的基數是 [1,2,2.5,5,10] 這個步驟是查找間隔屬於哪個範圍
if(stf
while( stf
c = c*10;
arr[0]=arr[0]/c;
}
每個([1,2,2.5,5,10],函數(i,o){
arr[i]= o/c;
});
}否則 if(stf>arr[4]){
while( stf>arr[4] ){
c = c*10;
arr[4] = arr[4]*c;
}
每個([1,2,2.5,5,10],函數(i,o){
arr[i]= o*c;
});
}
//上面找到間隔後找到間隔中最接近的
每個（arr，函數（i，o）{
if(stf
v = o;
回傳錯誤；
}
});
var bj = (mathAbs(a)*t)/(v*t),
ba = 0,
isZ = bj!==parseInt(bj);
是Z
&&a>0
？ ba = -a%v*t
: ba = (mathAbs(a)%v-v)*t;
a = (a*t ba)/t;
b = (b*t (b%v===0?0:(v-b%v))*t)/t;
//看看剩下幾條線沒有畫
var num = Math.max(0,lineNum - Math.round((b-a)/v));
if(a>=0){
//座標比較整數化
if(a!=0&&num!=0&&a !==0){
while(a!=0&&num!=0){
a = (a*t-v*t)/t;
數字--;
if((a*t-v*num*t)/10000>0&&a ===0)
休息；
}
}
if(num!=0){
while(num!==0){
b = (b*t v*t)/t
數--；
}
}
}其他{
//座標比較整數化
if(b
while(b!=0&&num!=0&&b !==0){
b = (b*t v*t)/t;
數字--;
if((b*t v*num*t)/t
休息;
}
}
if(num!=0){
while(num!==0){
a = (a*t-v*t)/t
數--；
}
}
}
返回 {min:a,max:b,stf:v};
}
//------------------------------------------------ -------------------------------------------------- -------------
//對svg vml元素的一些建立修改屬性樣式刪除==一些操作
win.vector = function(){};
向量.prototype = {
$c : 函數(圖形,節點名稱){
this.element = this[0] = doc.createElementNS('http://www.w3.org/2000/svg', nodeName);
this.graphic = 圖形;
返回此；
},
attr：函數（哈希，val）{
var elem = this.element,
關鍵，
值；
if(typeof hash === 'string'){
if(val === 未定義){
return elem.getAttribute(hash);
}其他{
elem.setAttribute(hash, val);
返回此；
}
} 其他 {
for（哈希中的鍵）{
值 = 哈希[鍵];
if(key === 路徑){
value && value.join
&&(value = value.join(' '));
/(NaN| |^$)/.test(值)
&&(值 = 'M 0 0');
}
elem.setAttribute(key, value)
}
}
返回此；
},
css：函數（雜湊）{
for（哈希中的 var key）{
isIE && key == "不透明度"
？ this[0].style['filter'] = "alpha(opacity=" hash[key] * 100 ")"
: this[0].style[key] = hash[key];
}
返回此；
},
on: 函數(事件名稱, 處理程序){
var self = this;
/*this.element.addEventListener(eventName,function(){
handler.call(self)
},假);*/
this.element['on' eventName] = function(e){
e = e || win.event;
handler.call(self,e);
}
返回此；
},
追加到：函數（父級）{
如果（父級）{
父元素
？ Parent.element.appendChild(this.element)
:parent.appendChild(this.element)
} 其他 {
this.graphic.container.appendChild(this.element);
}
返回此；
},
addText: 函數(str){
var elem = this.element;
if(elem.nodeName === '文字'){
elem.appendChild(doc.createTextNode(str ''));
}
返回此；
},
setOpacity : 函數(v){
this.attr('填入不透明度',v);
返回此；
},
setSize : 函數(v){
this[0].nodeName==='圓'
？ this.attr('r',4 (v===0?0:2))
: this.attr({'筆畫寬度':v});
返回此；
},
toFront: 函數() {
this[0].parentNode.appendChild(this[0]);
返回此；
},
顯示：函數(){
this[0].style.display = 'block';
返回此；
},
隱藏：函數(){
this[0].style.display = '無';
回這個；
},
銷毀：函數（）{
//檢索重點......................
var 節點 = this[0] ||這個；
node.onmouseover = node.onmouseout = node.onclick = null;
節點.parentNode
&&node.parentNode.removeChild(node);
返回此；
}
};
//------------------------------------------------ -------------------------------------------------- -------------
//------------------------------------------------ -------------------------------------------------- -
//如果是vml修改其中的一些方法
if(!hasSVG){
//-------------創建vml環境-----------------
doc.createStyleSheet().addRule(".vml", "behavior:url(#default#VML);display:inline-block;position:absolute;left:0px;top:0px");
!doc.namespaces.vml && ! "v1";
doc.namespaces.add("vml", "urn:schemas-microsoft-com:vml");
//-------------修改一些方法-----------------
extend(vector.prototype,{
$c : function(graphic,nodeName){
var name = nodeName || 'shape';
this.element= this[0] = (name === 'div' || name === 'span')
? doc.createElement(name)
: doc.createElement('
');
this.graphic = graphic;
return this;
},
/*on : function(eventName, handler){
var self = this;
this.element.attachEvent("on" eventName,function(){
handler.call(self);
});
return this;
},*/
addText : function(txt){
this[0].innerHTML = txt || '';
return this;
},
setSize : function(v){
this[0].strokeWeight = v;
return this;
},
setOpacity : function(v){
this.opacity.opacity=v;
return this;
}
});
}
//------------------------------------------------ -------------------------------------------------- -
//畫圖類別
//------------------------------------------------ ------------
win.smipleChart = function(){
this.init.apply(this,arguments);
};
smipleChart.list = [];
smipleChart.timer = null;
smipleChart.lazyLoad = function(id){
id = id || '0'
smipleChart.list[id]
&&smipleChart.list[id].loadMe();
};
smipleChart.prototype = {
options : {
charts : {
paddingRight : 20,
radius : 200,
style : {
fontFamily : '"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif',
fontSize : '12px',
background : '#FFFFFF'
}
},
title : {
text : '',
y : 10,
style : {
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'16px',
fontWeight:'bold'
}
},
subTitle : {
text : '',
y : 30,
style : {
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'12px',
color: '#111'
}
},
yUnit : {
text : '',
style : {
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'12px',
color: '#111'
},
lineNum :10
}
},
init : function(container,options){
clearTimeout(smipleChart.timer)
var self = this;
this.width = container.offsetWidth;
this.height = container.offsetHeight;
this.currList = {};
this.uuuid = uuuid;
this.timer = null;
//主要畫圖組的集合 形式
//{id : {dom:xx,show:true}}
this.mainGroup = {};
//分段的時候要用的 知道哪些是隱藏了的 因為要牽涉到重繪
this.hideList = {};
//svg 裡面畫圖 必須有一個svg標籤 vml就用div了
this.container = hasSVG
? new vector().$c(1,'svg')
.attr({
xmlns : 'http://www.w3.org/2000/svg',
version : '1.1',
width : this.width,
height : this.height
})
.css({fontSize : '12px'})
.appendTo(container)
: new vector().$c(1,'div')
.css({
fontSize : '12px',
width : this.width 'px',
height : this.height 'px'
})
.appendTo(container);
this.loading = container.appendChild(doc.createElement('img'));
this.loading.setAttribute('src','http://images.cnblogs.com/cnblogs_com/wtcsy/192373/r_loading.gif');
this.loading.style.position = 'absolute';
this.loading.style.top = container.offsetHeight/2- this.loading.offsetHeight/2 'px';
this.loading.style.left = container.offsetWidth/2- this.loading.offsetWidth/2 'px';
var c = extend(true,{},this.options),
opts = this.opts = extend(true,c,options),
style = extend(opts.charts.style,{
width : this.width,
height : this.height
});
smipleChart.list[this.uuuid] = this;
smipleChart.timer = setTimeout(function(){
smipleChart.lazyLoad();
},200);
},
loadMe : function(){
var opts = this.opts,
self = this,
type = opts.charts.type;
this.container = this.container
.on('mouseout',function(e){
var elem = e.relatedTarget || e.toElement;
if(!contains(this[0],elem)){
self.hideTooltip();
self.currList.dot
&&self.currList.dot.setSize(0);
self.currList.line
&&self.currList.line.setSize(1.5);
self.currList = {};
}
})
.css({display:'none'})[0];
//計算繪畫盤的時候所需的一些參數
this.getDrawArea()
.createTooltip() //建立提示訊息的方塊
.drawTitle() //以具標題
//畫盤
'line,area,pie'.indexOf(type)>=0
&&(opts.charts.panel = 'x');
' pie,pies'.indexOf(type)
&&this.drawPanel();
this.drawLegend(opts.legend.type); //畫色塊條
var 類型 = {
線 : 'drawLine',
區域 : 'drawArea',
列 : 'drawColumns',
餅 : 'drawPie',
派 : 'drawPies',
分段 : 'drawSegment'
}[opts.charts.type];
//開始畫圖..............
這個[類型]();
//刪除節點
this.loading.parentNode.removeChild(this.loading);
// 斷開引用
this.loading = null;
this.container.style.display = '';
setTimeout(function(){
smipleChart.lazyLoad(( self.uuuid) '');
},10)
},
createElement : 函數(節點名稱){
傳回新向量().$c(this,nodeName);
},
組：函數（名稱）{
return this.createElement(hasSVG?'g':'div').attr('mark',name);
},
getDrawArea : 函數(){
var opts = this.opts,
寬度 = this.width,
高度 = this.height,
標題 = opts.title,
子標題 = opts.subTitle,
面積 = {
// 底座座標軸左邊的文字寬度(叉) 80 為定值 左邊只留 80 的間距
區域寬度：寬度 - 80，
// 底座座標軸下的文字與標線的高度
區域高度：高度 - 40，
//原點的X位置下方會計算到
開始X：0，
//原點的Y位置下方會計算到
開始Y：0，
//中心的x座標畫餅圖的時候需要知道圓心的位置
中心X：0，
//中心的y座標畫餅圖的時候需要知道圓心的位置
中心Y: 0
};
//如果主標題存在降低主標題的高度，否則降低10的高度
area.areaHeight -=(title.text !== '')
？標題.y
: 10;
// 去掉副標題高度
area.areaHeight -=(subTitle.text !== '')
？副標題.y
: 10
區域.startX = 80;
area.startY = 高度 - 40;
// 圓心的位置
area.centerX = 寬度 / 2;
面積.centerY = 高度 / 2;
//右邊留些空隙
area.areaWidth -=20;
//上邊也留一些距離
area.areaHeight -=15;
opts.area = 面積；
返回此；
},
繪製標題：函數（）{
var opts = this.opts,
自我=這個，
arr = [opts.title,opts.subTitle,opts.yUnit],
//3個標題座標的基本參數
配置= [
{
x : this.width / 2,
y : opts.title.y
},
{
x : this.width / 2,
y : opts.subTitle.y
},
{
x : opts.yUnit.x,
y : this.height / 2 - 20
}
],
tpanel = this.group('title')
.appendTo();
each(arr,function(i,title){
var text = title.text;
if(text){
var elem = self.baseDraw.span(self,{
'text-anchor':'left',
x : mathMax(config[i].x - calTextLen(text,title.style).w/2,10),
y : config[i].y
},calTextLen(title.text,title.style).h)
.css(title.style)
.addText(text)
.appendTo(tpanel);
//如果為2的時候 就表示是副標題 將它豎起來
if(i===2){
hasSVG
? elem.attr({transform : 'rotate(270, ' (opts.yUnit.x 10) ', ' self.height / 2 ')'})
: (elem.element.style.filter ='progid:DXImageTransform.Microsoft.BasicImage(rotation=3)')
}
}
});
return this;
},
//畫盤子 比較麻煩
drawPanel : function(type){
var opts = this.opts,
self = this,
area = opts.area,
chartsType = opts.charts.type,
isSegment = chartsType === 'segment',
//盤子的種類 是橫盤 還是縱盤
type = opts.charts.panel || 'x';
// 底板
var drawAreaWidth = area.areaWidth,
drawAreaHeight = area.areaHeight,
//原點的座標
startX = area.startX,
startY = area.startY;
var allData = [],
minValue = 0,
maxValue = 10,
//線的條數 只能在1到10之間
lineNum = mathMin(10,mathMax(opts.yUnit.lineNum,1)),
staff;
//組合所有的資料
each(opts.chartData,function(i,o){
// 如果是長條圖 是對所有的資料求和
isSegment
? each(o.data,function(j,d){
allData[j]
? allData[j] = allData[j] (~~d)
: allData[j] = ~~d;
})
: allData = allData.concat(o.data)
});
//給予所有的資料排序 為了在下方求最大值 最小值
allData.sort(function(a,b){return a-b});
//求最大值 最小值
maxValue = allData[allData.length - 1];
each(allData,function(i,o){
if(o!==null){
minValue = o;
return false;
}
});
//主盤容器
var panel = this.group('panel').appendTo();
var result = xx(minValue,maxValue,lineNum),
min = result.min,
max = result.max,
f = result.stf;
isSegment
&&(min = 0);
//表示畫的是橫座標 或是雙座標
if(type.toLowerCase()==='x'){
//橫座標單位間隔
var xPices = drawAreaWidth / opts.xUnit.units.length,
//單位間隔的中心點
offset = xPices / 2,
yPices = drawAreaHeight / lineNum;
//--------------------------------畫橫向的點和文字---------- -----------------------------------------------
var y = hasSVG?5:10,
t = 1000,
span;
each(opts.xUnit.units,function(i,d){
self.baseDraw.path(self,{
border : 1,
borderColor : '#C0C0C0',
isfill : false,
path : [
M,
processPoint(startX (i * xPices)),
processPoint(startY),
L,
processPoint(startX (i*xPices)),
processPoint(startY 5)
]
}).
appendTo(panel);
span = self.baseDraw.span(self,{
x : startX offset (i * xPices),
y : startY y,
'text-anchor':'middle'
})
.css({
fontFamily : 'Verdana,Arial,Helvetica,sans-serif',
fontSize : '12px'
})
.addText(opts.xUnit.units[i])
.appendTo(panel)[0];
!hasSVG
&&(span.style.left = parseInt(span.style.left) - span.offsetWidth/2 'px');
});
//--------------------------------畫縱向的點和文字---------- -------------------------------------------------- -----------
for(i=0;i
self.baseDraw.path(self,{
border : 1,
borderColor : '#C0C0C0',
isfill : false,
path : [M, startX, processPoint(startY - (i * yPices)), L, processPoint(startX drawAreaWidth), processPoint(startY - (i *Pices)]
.css({zIndex:-10})
.appendTo(panel);
var span = self.baseDraw.span(self,{
x : startX - 15,
y : startY - i * yPices-calTextLen(min i*f '').h/2,
'text-anchor':'middle'
})
.css({
'font-family' : 'Verdana,Arial,Helvetica,sans-serif',
'font-size' : '12px',
width : '40px',
display : 'block',
textAlign : 'right'
})
.addText((min*t (i*t*f/t)*t)/t '')
.appendTo(panel)[0];
if(!hasSVG){
span.style.top = parseInt(span.style.top) span.offsetHeight/2 -5 'px';
span.style.left = parseInt(span.style.left) -35 'px'
}
}
}else{
//橫座標單位間隔
var yPices = drawAreaHeight / (opts.xUnit.units.length),
//單位間隔的中心點
offset = Math.round(yPices / 2),
x = hasSVG ? 25 : 70,
y = hasSVG ? 0 : 5,
span
each(opts.xUnit.units,function(i,d){
self.baseDraw.path(self,{
border : 1,
borderColor : '#C0C0C0',
isfill : false,
path : [
M,
processPoint(startX-5),
processPoint(startY-i * yPices),
L,
processPoint(startX),
processPoint(startY-i * yPices),
]
})
.appendTo(panel);
span = self.baseDraw.span(self,{
x : startX - x,
y : startY -i * yPices-offset-calTextLen(d).h/2 y,
'text-anchor':'middle'
})
.css({
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'12px',
width : '60px',
textAlign:'right'
})
.addText(d)
.appendTo(panel)
});
var xPices = drawAreaWidth / lineNum;
for(var i=0;i
self.baseDraw.path(self,{
border : 1,
borderColor : '#C0C0C0',
isfill : false,
path : [
M,
processPoint(startX (i * xPices)),
processPoint(startY),
L,
processPoint(startX (i*xPices)),
processPoint(startY - drawAreaHeight)
]
}).
appendTo(panel);
self.baseDraw.span(self,{
x : startX - calTextLen(min i*f '').w/2 i * xPices,
y : startY,
'text-anchor':'left'
})
.css({
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'12px'
})
.addText(min i*f '')
.appendTo(panel);
}
}
//------------------------------------------------ -------------------------------------------------- ---
//因為起點很可能不是從0開始的 所以在起點的時候要加上到0那部分的值
var jianju =0;
if(min>0)jianju = min;
if(max
startX = opts.charts.panel==='x' ? startX :startX-xPices*(min/f);
startY = opts.charts.panel==='x' ? startY yPices*(min/f) : startY;
opts.draw = {
startX : startX, // X 軸起點
startY : startY , // Y 軸起點
xPices : xPices, // X 軸每份的寬度
yPices : yPices, // Y 軸每份的寬度
offset : offset, // X 單分中心點位置偏移量
jianjuY : jianju*yPices/f,
jianjuX : jianju*xPices/f,
feed : f // Y 軸的每份有多少
}
return this;
},
createTooltip : function(){
//一組
this.tipC = this.group('tip')
.css({zIndex: 200,height:'20px',width:'20px',position:'absolute'})
.appendTo()
.hide()
//畫一個框框baseDraw
this.tipBox = this.baseDraw.rect(this,{arc:0.22,fill:'#fff',border:2,borderColor:'#606060'})
.appendTo(this.tipC)
//因為svg裡面的g可以直接定位 但是vml裡面的group渲染很慢 所以改div 所以這裡的父不一洋
var p = isIE ?this.tipBox :this.tipC;
this.tipTxtContainer = this.baseDraw.text(this,{fill:'#000000',x:5,y:19,'text-anchor':'left'})
.css({
fontFamily:'Verdana,Arial,Helvetica,sans-serif',
fontSize:'12px',
background: '#FFF'
})
.appendTo(p);
this.tipText = doc.createTextNode('');
this.tipTxtContainer[0].appendChild(this.tipText);
return this;
},
showTooltip : function(obj, x, y,data){
/*var txt = obj.name ':' data,
size = calTextLen(txt,this.tipTxtContainer[0].style.cssText),
pos = {x : x - (size.w 5 * 2)/2 ,y : y - 32};
this.tipC
.toFront()
.show();
if(hasSVG){
this.tipC.attr({transform:'translate(' pos.x ',' pos.y ')'});
this.tipBox
.attr({width : size.w 5 * 2,height : size.h 5 * 2,stroke : obj.color||'#606060'});
}else{
this.tipC.css({left:pos.x,top:pos.y});
this.tipBox
.css({width:size.w 5 * 2,height : size.h 5 * 2})
this.tipBox[0].strokeColor = obj.color||'#000';
}
this.tipText.nodeValue = txt || '';*/
clearTimeout(this.timer);
var txt = obj.name ':' data,
self = this,
size = calTextLen(txt,this.tipTxtContainer[0].style.cssText),
pos = {x : x - (size.w 5 * 2)/2 ,y : y - 32};
if(hasSVG){
self.tipBox
.attr({width : size.w 5 * 2,height : size.h 5 * 2,stroke : obj.color||'#606060'});
}else{
self.tipBox
.css({width:size.w 5 * 2,height : size.h 5 * 2})
self.tipBox[0].strokeColor = obj.color||'#000';
}
this.tipText.nodeValue = txt || '';
if(this.tipC[0].style.display === 'none'){
hasSVG
self.tipC.attr({transform:'translate(' pos.x ',' pos.y ')',pos:pos.x '-' pos.y})
: self.tipC.attr({pos:pos.x '-' pos.y}).css({left:pos.x,top:pos.y});
這個.tipC
.toFront()
.show();
}其他{
var move = function(t,b,c,d){
返回 c*(t/=d)*t b;
},
t = 0,
b = self.tipC.attr('pos').split('-'),
c = [pos.x,pos.y],
d = 5;
this.timer = setInterval(function(){
if(t
t ;
var x = move(t,~~b[0],(~~c[0])-(~~b[0]),d),
y = move(t,~~b[1],(~~c[1])-(~~b[1]),d);
有SVG
self.tipC.attr({transform:'translate('x','y')',pos:x'-'y})
: self.tipC.attr({pos:x '-' y}).css({left:x,top:y});
}其他{
清除超時(self.timer);
}
},1);
};
},
hideTooltip: 函數(){
this.tipC.hide();
},
drawLegend : 函數（型，重繪）{
var self =這個，
opts = this.opts，
isLine = opts.charts.type === 'line',
//色塊的大小
t_width = 20，
t_高度 = 20,
// 區塊之間的距離
t_space = 5,
資料 = opts.chartData,
len = datas.length,
css = opts.legend.style,
//最大長度如果是縱著的需要最大長度
最大寬度 = 10,
最大高度= 30,
//這個東西的位置
orig_pos = opts.legend.pos?opts.legend.pos:[2,2],
// 隱藏顯示組的函數
句柄 = 函數(i){
var g = self.mainGroup['圖表' i],
issegment = opts.charts.type==='segment';
if(g.show){
g.chart.hide();
g.show = false;
有SVG
this.attr({fill:'#ccc'})
: this[0].style.color = '#ccc';
//如果是分割圖 是會牽涉到重畫的
if（基質）{
self.hideList[i] ='';
var mainGroup = self.mainGroup;
for(mainGroup 中的指標名稱){
varparent = mainGroup[名稱].chart,
節點=父[0].childNodes，
len = 節點.length;
//回顧圖上面畫的東西
for(var i = len-1;i>=0;i--){
vector.prototype.destroy.call(nodes[i])
}
}
//重畫
self.drawSegment();
}
}其他{
g.chart.show();
g.show = true;
有SVG
？ this.attr({fill:'#000'})
: this[0].style.color = '#000'
if（分段）{
刪除 self.hideList[i];
var mainGroup = self.mainGroup;
for(mainGroup 中的變數名稱){
varparent = mainGroup[名稱].chart,
節點=父[0].childNodes，
len = 節點.length;
for(var i = len-1;i>=0;i--){
vector.prototype.destroy.call(nodes[i])
}
}
self.drawSegment();
}
}
},
arr = [];
類型 = 類型 ||'橫向';
var legendPanel = self.group('圖例')
.appendTo();
if(type==='橫向'){
//如果是橫著的
var top = orig_pos[1] 5,
th = hasSVG?0:3,
左 = orig_pos[0] 5;
每個（數據，函數（i，d）{
左=我===0？左：t_space 左；
// 計算所有剩餘的位置
//如果是線性圖 以線性圖的方式繪製圖
if(isLine){
self.baseDraw.path(self,{
邊框 ：1.5，
borderColor : d.color,
isfill ：假，
路徑 : [
中號，
left.toFixed(0),
(前 10 名).toFixed(0),
L，
(左 25).toFixed(0),
(前 10 名).toFixed(0)
]
})
.appendTo(legendPanel);
self.baseDraw[d.dotType ||] '圓圈'](自我，{
x ：左 12，
y ：前 10 名，
r：4，
填滿顏色：d.color
})
.appendTo(legendPanel);
}其他{
self.baseDraw.rect(self,{
弧 : 0.1,
填充 : d.color,
邊框 ：1，
borderColor : d.color,
左 ：左，
頂部 ：上，
寬度 : t_width 'px',
高度 : t_height 'px'
})
.appendTo(legendPanel)
}
左 = 左 t_width 2 t_space;
var w = calTextLen(d.name,css).w
self.baseDraw.span(self,{
'文字錨':'左',
x：左，
y : 上方
})
.css(extend(css,{cursor:'pointer'}))
.on('點選',function(){
handle.call(this,i);
})
.addText(d.name)
.appendTo(legendPanel);
左 = 左 w;
});
this.baseDraw.rect(這個,{
弧 : 0.1,
填寫 : '無',
邊框 ：1.5，
borderColor : '#666666',
寬度 ：左 t_space- orig_pos[0],
高度 : maxHeight,
左 : orig_pos[0],
上方 : orig_pos[1]
})
.appendTo(legendPanel);
}其他{
var top = orig_pos[1] 5,
th = hasSVG?0:3,
左 = orig_pos[0] 5;
每個（數據，函數（i，d）{
頂部 = i===0 ？頂部 : t_space 頂部;
self.baseDraw.rect(self,{
弧 : 0.1,
填充 : d.color,
邊框 ：1，
borderColor : d.color,
左 ：左，
頂部 ：頂部，
寬度 : t_width 'px',
高度 : t_height 'px'
})
.appendTo(legendPanel);
var h = calTextLen(d.name,css).h;
self.baseDraw.span(self,{
'文字錨':'左',
x : 左 t_width 2 t_space,
y : 上方
})
.css(extend(css,{cursor:'pointer'}))
.addText(d.name)
.on('點選',function(){
//如果是多層圓餅圖無法進入隱藏
if(opts.charts.type==='pies')return;
句柄.call(this,i);
})
.appendTo(圖例面板);
頂部 = 頂部 h t_space;
maxWidth = Math.max(maxWidth,calTextLen(d.name,css).w);
});
this.baseDraw.rect(這,{
&
