root / trunk / web / dojo / dojox / widget / AnalogGauge.js @ 12
History | View | Annotate | Download (6.87 KB)
| 1 | 9 | andrej.cim | /*
|
|---|---|---|---|
| 2 | Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved.
|
||
| 3 | Available via Academic Free License >= 2.1 OR the modified BSD license.
|
||
| 4 | see: http://dojotoolkit.org/license for details
|
||
| 5 | */
|
||
| 6 | |||
| 7 | |||
| 8 | if(!dojo._hasResource["dojox.widget.AnalogGauge"]){ |
||
| 9 | dojo._hasResource["dojox.widget.AnalogGauge"]=true; |
||
| 10 | dojo.provide("dojox.widget.AnalogGauge");
|
||
| 11 | dojo.require("dojox.gfx");
|
||
| 12 | dojo.require("dojox.widget.gauge._Gauge");
|
||
| 13 | dojo.experimental("dojox.widget.AnalogGauge");
|
||
| 14 | dojo.declare("dojox.widget.gauge.AnalogLineIndicator",[dojox.widget.gauge._Indicator],{_getShapes:function(){ |
||
| 15 | var _1=[];
|
||
| 16 | _1[0]=this._gauge.surface.createLine({x1:0,y1:-this.offset,x2:0,y2:-this.length-this.offset}).setStroke({color:this.color,width:this.width}); |
||
| 17 | return _1;
|
||
| 18 | },draw:function(_2){ |
||
| 19 | if(this.shapes){ |
||
| 20 | this._move(_2);
|
||
| 21 | }else{
|
||
| 22 | if(this.text){ |
||
| 23 | this._gauge.surface.rawNode.removeChild(this.text); |
||
| 24 | this.text=null; |
||
| 25 | } |
||
| 26 | var v=this.value; |
||
| 27 | if(v<this._gauge.min){ |
||
| 28 | v=this._gauge.min;
|
||
| 29 | } |
||
| 30 | if(v>this._gauge.max){ |
||
| 31 | v=this._gauge.max;
|
||
| 32 | } |
||
| 33 | var a=this._gauge._getAngle(v); |
||
| 34 | this.color=this.color||"#000000"; |
||
| 35 | this.length=this.length||this._gauge.radius; |
||
| 36 | this.width=this.width||1; |
||
| 37 | this.offset=this.offset||0; |
||
| 38 | this.highlight=this.highlight||"#D0D0D0"; |
||
| 39 | this.shapes=this._getShapes(this._gauge,this); |
||
| 40 | if(this.shapes){ |
||
| 41 | for(var s=0;s<this.shapes.length;s++){ |
||
| 42 | this.shapes[s].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(a)]); |
||
| 43 | if(this.hover){ |
||
| 44 | this.shapes[s].getEventSource().setAttribute("hover",this.hover); |
||
| 45 | } |
||
| 46 | if(this.onDragMove&&!this.noChange){ |
||
| 47 | this._gauge.connect(this.shapes[s].getEventSource(),"onmousedown",this._gauge.handleMouseDown); |
||
| 48 | this.shapes[s].getEventSource().style.cursor="pointer"; |
||
| 49 | } |
||
| 50 | } |
||
| 51 | } |
||
| 52 | if(this.label){ |
||
| 53 | var _3=this.length+this.offset; |
||
| 54 | var x=this._gauge.cx+(_3+5)*Math.sin(this._gauge._getRadians(a)); |
||
| 55 | var y=this._gauge.cy-(_3+5)*Math.cos(this._gauge._getRadians(a)); |
||
| 56 | var _4="start"; |
||
| 57 | if(a<=-10){ |
||
| 58 | _4="end";
|
||
| 59 | } |
||
| 60 | if(a>-10&&a<10){ |
||
| 61 | _4="middle";
|
||
| 62 | } |
||
| 63 | var _5="bottom"; |
||
| 64 | if((a<-90)||(a>90)){ |
||
| 65 | _5="top";
|
||
| 66 | } |
||
| 67 | this.text=this._gauge.drawText(""+this.label,x,y,_4,_5,this.color,this.font); |
||
| 68 | } |
||
| 69 | this.currentValue=this.value; |
||
| 70 | } |
||
| 71 | },_move:function(_6){ |
||
| 72 | var v=this.value; |
||
| 73 | if(v<this._gauge.min){ |
||
| 74 | v=this._gauge.min;
|
||
| 75 | } |
||
| 76 | if(v>this._gauge.max){ |
||
| 77 | v=this._gauge.max;
|
||
| 78 | } |
||
| 79 | var c=this.currentValue; |
||
| 80 | if(_6){
|
||
| 81 | var _7=this._gauge._getAngle(v); |
||
| 82 | for(var i in this.shapes){ |
||
| 83 | this.shapes[i].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(_7)]); |
||
| 84 | if(this.hover){ |
||
| 85 | this.shapes[i].getEventSource().setAttribute("hover",this.hover); |
||
| 86 | } |
||
| 87 | } |
||
| 88 | }else{
|
||
| 89 | if(c!=v){
|
||
| 90 | var _8=new dojo.Animation({curve:[c,v],duration:this.duration,easing:this.easing}); |
||
| 91 | dojo.connect(_8,"onAnimate",dojo.hitch(this,function(_9){ |
||
| 92 | for(var i in this.shapes){ |
||
| 93 | this.shapes[i].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(this._gauge._getAngle(_9))]); |
||
| 94 | if(this.hover){ |
||
| 95 | this.shapes[i].getEventSource().setAttribute("hover",this.hover); |
||
| 96 | } |
||
| 97 | } |
||
| 98 | this.currentValue=_9;
|
||
| 99 | })); |
||
| 100 | _8.play(); |
||
| 101 | } |
||
| 102 | } |
||
| 103 | }}); |
||
| 104 | dojo.declare("dojox.widget.AnalogGauge",dojox.widget.gauge._Gauge,{startAngle:-90,endAngle:90,cx:0,cy:0,radius:0,_defaultIndicator:dojox.widget.gauge.AnalogLineIndicator,startup:function(){ |
||
| 105 | if(this.getChildren){ |
||
| 106 | dojo.forEach(this.getChildren(),function(_a){ |
||
| 107 | _a.startup(); |
||
| 108 | }); |
||
| 109 | } |
||
| 110 | this.startAngle=Number(this.startAngle); |
||
| 111 | this.endAngle=Number(this.endAngle); |
||
| 112 | this.cx=Number(this.cx); |
||
| 113 | if(!this.cx){ |
||
| 114 | this.cx=this.width/2; |
||
| 115 | } |
||
| 116 | this.cy=Number(this.cy); |
||
| 117 | if(!this.cy){ |
||
| 118 | this.cy=this.height/2; |
||
| 119 | } |
||
| 120 | this.radius=Number(this.radius); |
||
| 121 | if(!this.radius){ |
||
| 122 | this.radius=Math.min(this.cx,this.cy)-25; |
||
| 123 | } |
||
| 124 | this._oppositeMiddle=(this.startAngle+this.endAngle)/2+180; |
||
| 125 | this.inherited(arguments); |
||
| 126 | },_getAngle:function(_b){ |
||
| 127 | return (_b-this.min)/(this.max-this.min)*(this.endAngle-this.startAngle)+this.startAngle; |
||
| 128 | },_getValueForAngle:function(_c){ |
||
| 129 | if(_c>this._oppositeMiddle){ |
||
| 130 | _c-=360;
|
||
| 131 | } |
||
| 132 | return (_c-this.startAngle)*(this.max-this.min)/(this.endAngle-this.startAngle)+this.min; |
||
| 133 | },_getRadians:function(_d){ |
||
| 134 | return _d*Math.PI/180; |
||
| 135 | },_getDegrees:function(_e){ |
||
| 136 | return _e*180/Math.PI; |
||
| 137 | },draw:function(){ |
||
| 138 | var i;
|
||
| 139 | if(this._rangeData){ |
||
| 140 | for(i=0;i<this._rangeData.length;i++){ |
||
| 141 | this.drawRange(this._rangeData[i]); |
||
| 142 | } |
||
| 143 | if(this._img&&this.image.overlay){ |
||
| 144 | this._img.moveToFront();
|
||
| 145 | } |
||
| 146 | } |
||
| 147 | if(this._indicatorData){ |
||
| 148 | for(i=0;i<this._indicatorData.length;i++){ |
||
| 149 | this._indicatorData[i].draw();
|
||
| 150 | } |
||
| 151 | } |
||
| 152 | },drawRange:function(_f){ |
||
| 153 | var _10;
|
||
| 154 | if(_f.shape){
|
||
| 155 | this.surface.remove(_f.shape);
|
||
| 156 | _f.shape=null;
|
||
| 157 | } |
||
| 158 | var a1;
|
||
| 159 | var a2;
|
||
| 160 | if((_f.low==this.min)&&(_f.high==this.max)&&((this.endAngle-this.startAngle)==360)){ |
||
| 161 | _10=this.surface.createCircle({cx:this.cx,cy:this.cy,r:this.radius}); |
||
| 162 | }else{
|
||
| 163 | a1=this._getRadians(this._getAngle(_f.low)); |
||
| 164 | a2=this._getRadians(this._getAngle(_f.high)); |
||
| 165 | var x1=this.cx+this.radius*Math.sin(a1); |
||
| 166 | var y1=this.cy-this.radius*Math.cos(a1); |
||
| 167 | var x2=this.cx+this.radius*Math.sin(a2); |
||
| 168 | var y2=this.cy-this.radius*Math.cos(a2); |
||
| 169 | var big=0; |
||
| 170 | if((a2-a1)>Math.PI){
|
||
| 171 | big=1;
|
||
| 172 | } |
||
| 173 | _10=this.surface.createPath();
|
||
| 174 | if(_f.size){
|
||
| 175 | _10.moveTo(this.cx+(this.radius-_f.size)*Math.sin(a1),this.cy-(this.radius-_f.size)*Math.cos(a1)); |
||
| 176 | }else{
|
||
| 177 | _10.moveTo(this.cx,this.cy); |
||
| 178 | } |
||
| 179 | _10.lineTo(x1,y1); |
||
| 180 | _10.arcTo(this.radius,this.radius,0,big,1,x2,y2); |
||
| 181 | if(_f.size){
|
||
| 182 | _10.lineTo(this.cx+(this.radius-_f.size)*Math.sin(a2),this.cy-(this.radius-_f.size)*Math.cos(a2)); |
||
| 183 | _10.arcTo((this.radius-_f.size),(this.radius-_f.size),0,big,0,this.cx+(this.radius-_f.size)*Math.sin(a1),this.cy-(this.radius-_f.size)*Math.cos(a1)); |
||
| 184 | } |
||
| 185 | _10.closePath(); |
||
| 186 | } |
||
| 187 | if(dojo.isArray(_f.color)||dojo.isString(_f.color)){
|
||
| 188 | _10.setStroke({color:_f.color});
|
||
| 189 | _10.setFill(_f.color); |
||
| 190 | }else{
|
||
| 191 | if(_f.color.type){
|
||
| 192 | a1=this._getRadians(this._getAngle(_f.low)); |
||
| 193 | a2=this._getRadians(this._getAngle(_f.high)); |
||
| 194 | _f.color.x1=this.cx+(this.radius*Math.sin(a1))/2; |
||
| 195 | _f.color.x2=this.cx+(this.radius*Math.sin(a2))/2; |
||
| 196 | _f.color.y1=this.cy-(this.radius*Math.cos(a1))/2; |
||
| 197 | _f.color.y2=this.cy-(this.radius*Math.cos(a2))/2; |
||
| 198 | _10.setFill(_f.color); |
||
| 199 | _10.setStroke({color:_f.color.colors[0].color});
|
||
| 200 | }else{
|
||
| 201 | _10.setStroke({color:"green"});
|
||
| 202 | _10.setFill("green");
|
||
| 203 | _10.getEventSource().setAttribute("class",_f.color.style);
|
||
| 204 | } |
||
| 205 | } |
||
| 206 | if(_f.hover){
|
||
| 207 | _10.getEventSource().setAttribute("hover",_f.hover);
|
||
| 208 | } |
||
| 209 | _f.shape=_10; |
||
| 210 | },getRangeUnderMouse:function(_11){ |
||
| 211 | var _12=null; |
||
| 212 | var pos=dojo.coords(this.gaugeContent); |
||
| 213 | var x=_11.clientX-pos.x;
|
||
| 214 | var y=_11.clientY-pos.y;
|
||
| 215 | var r=Math.sqrt((y-this.cy)*(y-this.cy)+(x-this.cx)*(x-this.cx)); |
||
| 216 | if(r<this.radius){ |
||
| 217 | var _13=this._getDegrees(Math.atan2(y-this.cy,x-this.cx)+Math.PI/2); |
||
| 218 | var _14=this._getValueForAngle(_13); |
||
| 219 | if(this._rangeData){ |
||
| 220 | for(var i=0;(i<this._rangeData.length)&&!_12;i++){ |
||
| 221 | if((Number(this._rangeData[i].low)<=_14)&&(Number(this._rangeData[i].high)>=_14)){ |
||
| 222 | _12=this._rangeData[i];
|
||
| 223 | } |
||
| 224 | } |
||
| 225 | } |
||
| 226 | } |
||
| 227 | return _12;
|
||
| 228 | },_dragIndicator:function(_15,_16){ |
||
| 229 | var pos=dojo.coords(_15.gaugeContent);
|
||
| 230 | var x=_16.clientX-pos.x;
|
||
| 231 | var y=_16.clientY-pos.y;
|
||
| 232 | var _17=_15._getDegrees(Math.atan2(y-_15.cy,x-_15.cx)+Math.PI/2); |
||
| 233 | var _18=_15._getValueForAngle(_17);
|
||
| 234 | if(_18<_15.min){
|
||
| 235 | _18=_15.min; |
||
| 236 | } |
||
| 237 | if(_18>_15.max){
|
||
| 238 | _18=_15.max; |
||
| 239 | } |
||
| 240 | _15._drag.value=_18; |
||
| 241 | _15._drag.currentValue=_18; |
||
| 242 | _15._drag.onDragMove(_15._drag); |
||
| 243 | _15._drag.draw(true);
|
||
| 244 | dojo.stopEvent(_16); |
||
| 245 | }}); |
||
| 246 | } |