[483] | 1 | define(["dojo/_base/lang", "dojo/_base/Color"], function(lang, Color){ |
---|
| 2 | // module: |
---|
| 3 | // dojox/dgauges/components/utils |
---|
| 4 | // summary: |
---|
| 5 | // Gauge utilities. |
---|
| 6 | // tags: |
---|
| 7 | // public |
---|
| 8 | |
---|
| 9 | var utils = {}; |
---|
| 10 | |
---|
| 11 | lang.mixin(utils, { |
---|
| 12 | brightness: function(col, b){ |
---|
| 13 | // summary: |
---|
| 14 | // Adjusts the brightness of a color. |
---|
| 15 | // col: Number |
---|
| 16 | // The base color |
---|
| 17 | // b: Number |
---|
| 18 | // A positive or negative value to adjust the brightness |
---|
| 19 | // returns: Number |
---|
| 20 | // The modified color |
---|
| 21 | var res = lang.mixin(null, col); |
---|
| 22 | res.r = Math.max(Math.min(res.r + b, 255), 0); |
---|
| 23 | res.g = Math.max(Math.min(res.g + b, 255), 0); |
---|
| 24 | res.b = Math.max(Math.min(res.b + b, 255), 0); |
---|
| 25 | return res; |
---|
| 26 | }, |
---|
| 27 | |
---|
| 28 | createGradient: function(entries){ |
---|
| 29 | // summary: |
---|
| 30 | // Creates a gradient object |
---|
| 31 | // entries: Array |
---|
| 32 | // An array of numbers representing colors |
---|
| 33 | // returns: Number |
---|
| 34 | // The modified color |
---|
| 35 | var res = { |
---|
| 36 | colors: [] |
---|
| 37 | }; |
---|
| 38 | var obj; |
---|
| 39 | for(var i = 0; i < entries.length; i++){ |
---|
| 40 | if(i % 2 == 0){ |
---|
| 41 | obj = { |
---|
| 42 | offset: entries[i] |
---|
| 43 | }; |
---|
| 44 | } else { |
---|
| 45 | obj.color = entries[i]; |
---|
| 46 | res.colors.push(obj); |
---|
| 47 | } |
---|
| 48 | } |
---|
| 49 | return res; |
---|
| 50 | }, |
---|
| 51 | |
---|
| 52 | _setter: function(obj, attributes, values){ |
---|
| 53 | for(var i = 0; i < attributes.length; i++){ |
---|
| 54 | obj[attributes[i]] = values[i]; |
---|
| 55 | } |
---|
| 56 | }, |
---|
| 57 | |
---|
| 58 | genericCircularGauge: function(scale, indicator, originX, originY, radius, startAngle, endAngle, orientation, font, labelPosition, tickShapeFunc){ |
---|
| 59 | // summary: |
---|
| 60 | // A helper method for configuring a circular gauge. |
---|
| 61 | // scale: CircularScale |
---|
| 62 | // A circular scale |
---|
| 63 | // indicator: IndicatorBase |
---|
| 64 | // A circular indicator |
---|
| 65 | // originX: Number |
---|
| 66 | // The x-coordinate of the center of the scale (in pixels) |
---|
| 67 | // originY: Number |
---|
| 68 | // The y-coordinate of the center of the scale (in pixels) |
---|
| 69 | // radius: Number |
---|
| 70 | // The radius of the scale (in pixels) |
---|
| 71 | // startAngle: Number |
---|
| 72 | // The start angle of the scale (in degrees) |
---|
| 73 | // endAngle: Number |
---|
| 74 | // The end angle of the scale (in degrees) |
---|
| 75 | // orientation: String? |
---|
| 76 | // The orientation of the scale, can be "clockwise" or "cclockwise" |
---|
| 77 | // font: Object? |
---|
| 78 | // The font used for the gauge |
---|
| 79 | // labelPosition: String? |
---|
| 80 | // The position of the labels regarding |
---|
| 81 | // tickShapeFunc: Object? |
---|
| 82 | // A drawing function for the ticks |
---|
| 83 | // returns: Number |
---|
| 84 | // The modified color |
---|
| 85 | var attributes = ["originX", "originY", "radius", "startAngle", "endAngle", "orientation", "font", "labelPosition", "tickShapeFunc"]; |
---|
| 86 | if(!orientation){ |
---|
| 87 | orientation = "clockwise"; |
---|
| 88 | } |
---|
| 89 | if(!font){ |
---|
| 90 | font = { |
---|
| 91 | family: "Helvetica", |
---|
| 92 | style: "normal", |
---|
| 93 | size: "10pt", |
---|
| 94 | color: "#555555" |
---|
| 95 | }; |
---|
| 96 | } |
---|
| 97 | if(!labelPosition){ |
---|
| 98 | labelPosition = "inside"; |
---|
| 99 | } |
---|
| 100 | if(!tickShapeFunc){ |
---|
| 101 | tickShapeFunc = function(group, scale, tick){ |
---|
| 102 | var stroke = scale.tickStroke; |
---|
| 103 | var majorStroke; |
---|
| 104 | var minorStroke; |
---|
| 105 | if(stroke){ |
---|
| 106 | majorStroke = {color:stroke.color ? stroke.color : "#000000", width:stroke.width ? stroke.width : 0.5}; |
---|
| 107 | var col = new Color(stroke.color).toRgb(); |
---|
| 108 | minorStroke = {color:stroke.color ? utils.brightness({r:col[0], g:col[1], b:col[2]},51) : "#000000", width:stroke.width ? stroke.width * 0.6 : 0.3}; |
---|
| 109 | } |
---|
| 110 | return group.createLine({ |
---|
| 111 | x1: tick.isMinor ? 2 : 0, |
---|
| 112 | y1: 0, |
---|
| 113 | x2: tick.isMinor ? 8 : 10, |
---|
| 114 | y2: 0 |
---|
| 115 | }).setStroke(tick.isMinor ? minorStroke : majorStroke); |
---|
| 116 | }; |
---|
| 117 | } |
---|
| 118 | |
---|
| 119 | this._setter(scale, attributes, [originX, originY, radius, startAngle, endAngle, orientation, font, labelPosition, tickShapeFunc]); |
---|
| 120 | |
---|
| 121 | indicator.set("interactionArea", "gauge"); |
---|
| 122 | // Needle shape |
---|
| 123 | indicator.set("indicatorShapeFunc", function(group, indicator){ |
---|
| 124 | return group.createPolyline([0, -5, indicator.scale.radius - 6, 0, 0, 5, 0, -5]).setStroke({ |
---|
| 125 | color: "#333333", |
---|
| 126 | width: 0.25 |
---|
| 127 | }).setFill(scale._gauge.indicatorColor); |
---|
| 128 | }); |
---|
| 129 | } |
---|
| 130 | }); |
---|
| 131 | |
---|
| 132 | return utils; |
---|
| 133 | }); |
---|