Angular gauge(?????) ? ???? ??? ?? ?? ?? ?? ??? ???, ???? ????, Tool Tip, ?? ??? ?? ????.
var defaultOptions = { data : { data : null, url: null, type: null, reverse: false, jsonDepth: 'output.result', format: null, use : null, dataLen : null }, use :{ axis: true, axisText : true, counter : true, max :'auto', avg : 'auto', target : false, toolTip: true, animate: true, animateText: true, resize: false, responsive: false , }, toolTip : { className : null, position : { x : 0, y : 0 }, func : null }, minmax : { min : 'auto', max : 'auto' }, pointer:{ max: 'auto' avg : 'auto' target : 0 }, }
URL? ?? JSON ???? ?? ??? ??? ??
datas | array | JSON DATA? ??? ?? |
var options = { data: { data: [ {date: 20120101, price: 10000, legend: 'A'}, {date: 20120101, price: 20000, legend: 'B'}, {date: 20120101, price: 30000, legend: 'C'}, {date: 20120101, price: 40000, legend: 'D'} ] } }
Angular gauge(?????) ? ??? ??? ??
value | string | ??? ??(AJAX? ??) |
var options = { data: { url: 'http://www.cyber-i.com/' } }
Angular gauge(?????) ? ??? ??? ??
value | string | ??? ?? ["json", "text"] |
var options = { data: { type: 'json' } }
value | boolean | ???? ??? ????? ?? ?????? ??? ?? ?? [false, true] |
var options = { data: { reverse: false } }
json ???? ??? ?? ??
value | string | ?? ???? ?? ??? '.' ? ?? |
var options = { data: { jsonDepth: 'output.result' } }
// DATA RESULT { output: { result: [ {date: 20120101, price: 10000, legend: 'A'}, {date: 20120101, price: 20000, legend: 'B'}, {date: 20120101, price: 30000, legend: 'C'}, {date: 20120101, price: 40000, legend: 'D'} ] } }
data ? format ??? ??????.
format ??? "prime" , "percent" , "temperature"
value | string | default? null??? ?????? ????? ?????. |
var options = { data: { format: null } }
??? ???? ?? ?? ( Angular gauge ? ?? ????? ?? )
value | Array | Angular gauge ? ?? ??? ??? ??? ???? ? |
var options = { data: { use: ['price'] } }
???? ???? ?? ??? ??
(*??? ??? ??? ??? ?? ??? ???? ??)
value | Int | Angular gauge ? ??? ???? ??? ???? ? |
var options = { data: { dataLen: 100 } }
value | boolean | Angular gauge(?????) ? ?? ?? ?? |
var options = { use: { axis : true } }
value | boolean | Angular gauge(?????)? ?? ?? ?? |
var options = { use: { axisText: true } }
value | boolean | Angular gauge(?????) ? ??? ???? ??? ???? |
var options = { use: { counter: true } }
??? ????? ??? ?? ??
*???? ??? ?? true ? pointer.max? ??? ??? ??,
**'auto'(default)? ??? ??? ?? ?? ??
value | string || boolean | ??? ????? ??? ?? ? ?? ?? |
// * ? ?? var options = { use: { max: true }, pointer : { max: 120 } } // ** ?? (??) var options = { use: { max: 'auto' }, pointer : { max: 'auto' } }
??? ????? ??? ?? ??
*???? ??? ?? true, pointer.avg? ?? ?? ??
**'auto'(default)? ??? ??? ?? ?? ??
value | string || boolean | ??? ????? ??? ?? ? ?? ?? |
// * ? ?? var options = { use: { avg: true }, pointer : { avg: 50 } } // ** ?? (??) var options = { use: { avg: 'auto' }, pointer : { avg: 'auto' } }
Angular ?? ? ?? ??
value | boolean | Angular gauge(?????) ?? ? ?? ?? |
var options = { use: { target: false } }
??? ?? ??
value | boolean | ??? ?? ?? |
var options = { use: { toolTip: true } }
Angular ?? animate ?? ?? ??
value | boolean | Angular gauge(?????) ?? animate ?? ?? ?? |
var options = { use: { animate: true } }
Angular ?? ??? animate ?? ?? ??
value | boolean | Angular gauge(?????) ?? ?????(???) ????? ?? ?? |
var options = { use: { animateText: true } }
Angular? ???? ????? ??
value | boolean | Angular gauge(?????)? ???? ????? ?? |
var options = { use: { resize: false } }
resize ????? ?? ??
value | boolean | resize ????? ?? ??
|
var options = { use: { responsive: false } }
??? class? ?? ?? CSS? ??? ? ??
value | string | ??? class? ?? |
var options = { toolTip: { className: 'angular_tooltip' } }
??? X,Y ?? ??
value | object | ??? X,Y ?? ?? |
var options = { toolTip: { position: { x : 20, y : 20 } } }
?? ?? function
tipfunction | function | ?? ??? ? css ? ??? ? ? ??.
|
var options = { toolTip: { func: function(pie, data, tipElement){ tip.html( '?? : ' + data.date + '<br/>?? : ' + data.price ); tip.css({color : 'gray'}); } } }
angular ?? ???? ?????.
value | int | Angular gauge(?????)? ??? ???? ?? ('auto' ? ???? ??) |
var options = { minmax: { min: -50 } }
angular ?? ???? ??
value | int | Angular gauge(?????)? ??? ???? ?? ('auto' ? ???? ??) |
var options = { minmax: { max: 100 } }
??? ????? ??? ??, int? ??? ??? ???? ??? max?? ??? ? ????. (default - 'auto')
( * options.use.max ? ?? true ? ???? ???? )
value | int | ??? ????? ??? ('auto' ? ???? ??) |
var options = { pointer: { max: 'auto' } }
??? ????? ??? ??, int? ??? ??? ???? ??? ???? ??? ? ????. (default - 'auto')
( * options.use.avg? ?? true ? ???? ???? )
value | int | ??? ????? ??? ?? ('auto' ? ???? ??) |
var options = { pointer: { avg: 'auto' } }
???? ??? ???? ??. (default - 0)
( * options.use.target? ?? true ? ???? ???? )
value | int | ???? ??? ???? ?? |
var options = { pointer: { target: 0 } }