Vedmack

How To Make The Tick Value To Display Only Integers (And Not Numbers With Floating Point)

Recommended Posts

In my angular gauge i got min value 0 , max value of 43 and some "current value"

 

Why when the current value is 0 or 1 the tick value around the gauge is being displayed as floating point numbers

 

and when the current value is 2 there are no values in the ticks surrounding the gauge at all

 

I want the tick value to be displayed always , but Integers only

 

I did try using the "adjustTM" with various numbers , but when it comes to "current value" being 0 or 1 , its no good :/

 

Here is my code

 


               var max =  43
		if (max === -1) {
			return;
		}
	var slice = max / 3;

		var chartData = {
			"chart": {
				"manageresize": "1",
				"origw": "400",
				"origh": "250",
				"managevalueoverlapping": "1",
				"autoaligntickvalues": "1",
				"fillangle": "45",
				"upperlimit": max,
				"lowerlimit": "0",
				"majortmnumber": "10",
				"majortmheight": "8",
				"showgaugeborder": "0",
				"gaugeouterradius": "140",
				"gaugeoriginx": "205",
				"gaugeoriginy": "206",
				"gaugeinnerradius": "2",
				"formatnumberscale": "0",
				"decmials": "0",
				"tickmarkdecimals": "1",
				"pivotradius": "17",
				"showpivotborder": "1",
				"pivotbordercolor": "000000",
				"pivotborderthickness": "5",
				"pivotfillmix": "FFFFFF,000000",
				"tickvaluedistance": "10",
				"showvalue": "1",
				"borderalpha": "0",
				"bgAlpha" : '0',
				"bgColor" : 'ffffff',
				"valueBelowPivot" : "1
			},
			"colorrange": {
				"color": [
					{
						"minvalue": 0,
						"maxvalue": slice,
						"code": "399E38"
					},
					{
						"minvalue": slice,
						"maxvalue": slice + slice,
						"code": "E48739"
					},
					{
						"minvalue": slice + slice,
						"maxvalue": max,
						"code": "B41527"
					}
				]
			},
			"dials": {
				"dial": [
					{
						"value": 1,
						"borderalpha": "0",
						"bgcolor": "000000",
						"basewidth": "28",
						"topwidth": "1",
						"radius": "130"
					}
				]
			},
			"annotations": {
				"groups": [
					{
						"x": "205",
						"y": "207.5",
						"items": [
							{
								"type": "circle",
								"x": "0",
								"y": "2.5",
								"radius": "150",
								"startangle": "0",
								"endangle": "180",
								"fillpattern": "linear",
								"fillasgradient": "1",
								"fillcolor": "dddddd,666666",
								"fillalpha": "100,100",
								"fillratio": "50,50",
								"fillangle": "0",
								"showborder": "1",
								"bordercolor": "444444",
								"borderthickness": "2"
							},
							{
								"type": "circle",
								"x": "0",
								"y": "0",
								"radius": "145",
								"startangle": "0",
								"endangle": "180",
								"fillpattern": "linear",
								"fillasgradient": "1",
								"fillcolor": "666666,ffffff",
								"fillalpha": "100,100",
								"fillratio": "50,50",
								"fillangle": "0"
							}
						]
					}
				]
			},
			"styles": {
				"definition": [
			    	{
				    	"type": "font",
				    	"name": "myAngularGaugeSpecialFont",
				    	"color": "000000",
				    	"size": "22"
			    	}
				],
				"application": [
			    	{
				    	"toobject": "Value",
				    	"styles": "myAngularGaugeSpecialFont"
			    	}
				]
			}
		};

 

Thanks ahead,

 

Daniel

post-28512-0-10371500-1344433909_thumb.png

post-28512-0-42213900-1344433916_thumb.png

Edited by Vedmack

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

You would have set upperLimit and lowerLimit accordingly for the desired results.

 

Also, the Gauge displays the values according to the majorTMNumber and minorTMNumber attributes.

 

For displaying non-decimal values (whole number), you would need to apply tickValueDecimals and decimals attributes as "0" under the chart element.

 

The gauge internally calculates all these parameters and displays the values accordingly.

 

Ref. Code:

 

{

"chart": { ...

"upperlimit" : "40",

"lowerlimit" : "0",

"majorTMNumber" :"5",

"minorTMNumber" : "6",

"tickValueDecimals" : "0",

"decimals" : "0"

},

Please find attached screen-shots for your reference.

post-24802-0-16692100-1344516396_thumb.png

post-24802-0-78779600-1344516404_thumb.png

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now