Question

I want to move the text indicator to little down, am able to change the color and change the size of it but not the position. Below is my code.

require(['dojox/gauges/GlossyCircularGauge','dojo/aspect', 'drawGreenYellowRedCurves', 'dojo/domReady!'], function (GlossyCircularGauge, aspect, drawGreenYellowRedCurves) {
    var gauge = new GlossyCircularGauge({
        background: [255, 255, 255, 0],
        title: 'Value',
        id: "glossyGauge",
        width: 300,
        height: 300
    }, dojo.byId("CircularGauge"));
    gauge.set('textIndicatorFont','normal small-caps bold 22pt Arial');
    gauge.set('textIndicatorColor','#FFFFF');
    aspect.after(gauge, "drawRange", drawGreenYellowRedCurves, true);
    gauge.startup();

});

for reference http://jsfiddle.net/rameshcharykotha/dsmfg/14/

Was it helpful?

Solution

you can change the value of the internal attribute _designTextIndicatorY to update the text indicator position. Default value is 267.81589, but you can use a greater value to lower down the position of the text indicator.

Example:

require(['dojox/gauges/GlossyCircularGauge','dojo/aspect', 'drawGreenYellowRedCurves', 'dojo/domReady!'], function (GlossyCircularGauge, aspect, drawGreenYellowRedCurves) {
var gauge = new GlossyCircularGauge({
    background: [255, 255, 255, 0],
    title: 'Value',
    id: "glossyGauge",
    width: 300,
    height: 300,
    _designTextIndicatorY: 317.81589
}, dojo.byId("CircularGauge"));
gauge.set('textIndicatorFont','normal small-caps bold 22pt Arial');
gauge.set('textIndicatorColor','#FFFFF');
aspect.after(gauge, "drawRange", drawGreenYellowRedCurves, true);
gauge.startup();
});

OTHER TIPS

This is not directly answering your question but it might still help, dojox/gauges have been deprecated your are encouraged to use dojox/dgauges instead. See doc: http://dojotoolkit.org/reference-guide/1.9/dojox/dgauges.html#dojox-dgauges

A little while ago i answered a similar question. There someone wants to change the rangecolors in the new dGauge. Have a look at this fiddle: http://jsfiddle.net/v7WwD/

Here's the part in the new dgauge that's intresting for you:

// Indicator Text
indicator = gauge._elementsIndex.scale._indicators[0];
   var indicatorText = new TextIndicator();
   indicatorText.set("indicator", indicator);
   indicatorText.set("x", 100);
   indicatorText.set("y", 100);
   gauge.addElement("indicatorText", indicatorText);

To make it clear how to implement this, look at the entire code in my fiddle.

Regards, Miriam

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top