Expose an additional property in RadGauge that controls the margin for the gaugeArea.

Add border and border appearance options like color, width and type for the RadGauge. Currently the background color of the RadGauge is set to the wrapper of the control. Improve that color so that it fits in with the border and the shape of the control.

For the time being you can use the following workaround:

        <script>
            var pointerSize = 35;

            function pageLoad() {
                var gauge = $find("<%=rgEpmScorecard.ClientID%>");
                gauge._gaugeObject.options.scale.rangeSize = 25;
                gauge.repaint();
            }

        </script>
        <telerik:RadRadialGauge ID="rgEpmScorecard" runat="server" Skin="Metro" Height="99px" Width="100px">
            <Pointer Value="50" Color="Black">
                <Cap Size="0.5" Color="Black" />
            </Pointer>
            <Scale MajorUnit="10" Max="100" Labels-Visible="false" StartAngle="-45" EndAngle="225">
                <MajorTicks Visible="false" />
                <MinorTicks Visible="false" />
                <Ranges>
                    <telerik:GaugeRange Color="#ac1d23" From="0" To="16.67" />
                    <telerik:GaugeRange Color="#c26522" From="16.7" To="33.33" />
                    <telerik:GaugeRange Color="#d2b408" From="33.5" To="50" />
                    <telerik:GaugeRange Color="#b5be25" From="50.04" To="66.66" />
                    <telerik:GaugeRange Color="#0c833f" From="66.8" To="83.33" />
                    <telerik:GaugeRange Color="#0b6cb3" From="83.38" To="100" />
                </Ranges>
            </Scale>
        </telerik:RadRadialGauge>
        <script>

            var dataviz = kendo.dataviz,
                draw = dataviz.drawing,
                Path = draw.Path,
                DEFAULT_LINE_WIDTH = 0.5;

            kendo.dataviz.RadialPointer.fn._renderNeedle = function () {
                var that = this;
                var options = that.options;
                var minorTickSize = that.scale.options.minorTicks.size;
                var center = that.center;
                var needleColor = options.color;

                var needlePath = new Path({
                    fill: { color: needleColor },
                    stroke: { color: needleColor, width: DEFAULT_LINE_WIDTH }
                });

                needlePath.moveTo(center.x + that.radius - minorTickSize + pointerSize, center.y)
                          .lineTo(center.x, center.y - (that.capSize / 2))
                          .lineTo(center.x, center.y + (that.capSize / 2))
                          .close();

                return needlePath;
            }
        </script>

As a workaround the width of the range placeholder can be set through the gaugeObject:
JavaScript:
		function pageLoad() {
			var gauge = $find("<%=RadRadialGauge1.ClientID%>");
			gauge._gaugeObject.options.scale.rangeSize = 30;
			gauge.repaint();
		}
		<telerik:RadRadialGauge runat="server" ID="RadRadialGauge1" Height="350px" Width="350px">
			<Pointer Value="220" Color="Black">
				<Cap Color="Gray" Size="0.1" />
			</Pointer>
			<Scale Min="120" Max="300" MajorUnit="30" MinorUnit="5">
				<Labels Format="{0} °C" Position="Outside" />
				<Ranges>
					<telerik:GaugeRange Color="Orange" From="150" To="190" />
					<telerik:GaugeRange Color="Green" From="190" To="230" />
					<telerik:GaugeRange Color="Red" From="230" To="300" />
				</Ranges>
			</Scale>
		</telerik:RadRadialGauge>

This should also allow accessing them in the code-behind through their names and not only by their index, e.g.:

GuageName.Scale.Ranges[GaugeRangeName].From = value;

Add a new property to HtmlChart as well as Gauges to AutoResize on parent control size change. A precondition to this is Height and Width of the control must be set in percentages of the parent control.

To implement this we can either use window.onresize or ResizeObserver.

Reference

Reference 2

For the time being you can position a style element with absolute position below the gauge cap that will store the current value of the gauge. See an example in the http://www.telerik.com/forums/some-questions-c37b45192cef forum post.

You can vote for this feature so that it must be implemented in the Kendo Gauge first http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback/suggestions/3692105-hi-need-a-label-for-the-pointer-shown-in-the-line
Once it gets implemented, it can be ported to the UI for ASP.NET AJAX Gauge server wrapper.

You can do this with the Template property of the Label object

			<telerik:RadLinearGauge runat="server" ID="rlg1">
				<Scale Min="1" Max="4" MajorUnit="1">
					<Labels Template="#= getLabelText(value)#" />
				</Scale>
			</telerik:RadLinearGauge>
			<telerik:RadRadialGauge runat="server" ID="rrg1">
				<Scale Min="1" Max="4" MajorUnit="1">
					<Labels Template="#= getLabelText(value)#" />
				</Scale>
			</telerik:RadRadialGauge>
			<script>
				function getLabelText(e) {
					return "label for " + e;
				}
			</script>

For old versions the template can be set through the kendoWidget:

ASPX:

        <script>
            function setGaugeLabels(value) {
                switch (value) {
                    case -10:
                        return "Min: " + -10;
                        break;
                    case 35:
                        return "Max: " + 35;
                        break;
                    default:
                        return "Name: " + value;
                        break;
                }
            }
            function pageLoad() {
                var gaugeObj = $find("<%=RadLinearGauge1.ClientID%>")._gaugeObject;
                gaugeObj.options.scale.labels.template = "#=setGaugeLabels(value)#";
                gaugeObj.redraw();
            }
        </script>
        <telerik:RadLinearGauge runat="server" ID="RadLinearGauge1" Height="300px" Width="100px">
            <Pointer Value="11" Color="Green">
            </Pointer>
            <Scale Min="-25" Max="50" MajorUnit="15" MinorUnit="1">
                <Labels Format="{0} °C" />
                <Ranges>
                    <telerik:GaugeRange From="-25" To="-5" Color="Blue" />
                    <telerik:GaugeRange From="-5" To="15" Color="LightBlue" />
                    <telerik:GaugeRange From="15" To="30" Color="GreenYellow" />
                    <telerik:GaugeRange From="30" To="50" Color="Red" />
                </Ranges>
            </Scale>
        </telerik:RadLinearGauge>

It would be nice if RadGauges, the radial ones especially, could include a title element

I would like to consider the ability to customise the labels for the GaugeRange items that may not be part of a numerical index. For example, you may have a 3 range gauge that is low (green) / medium (orange) / high (red). Currently there is no way of customising these values.

I believe this would be similar to what is currently done in the Slider control ( http://demos.telerik.com/aspnet-ajax/slider/examples/slideritems/defaultvb.aspx)

Currently RadGauge has an option to turn on/off the animation when the chart is rendered through its transition property. If that property is set to true the requested feature will allow setting the speed/duration of the animation. 

The scenario is the same web-page should render perfectly on all kind of devices(mobile, tablet, desktop, laptop, projector, and high-resolution TV etc.)

The Bar width is set using Size property for Minor tick. The Pointer Width is set using Size property of Pointer.

Now that the sizes for bar and pointers are fixed, we cannot change it with changing screen resolution.

SVG has the property for scaling itself based on the design size and actual size on the client (ViewPort Size).

If something like design width and design height property is added, it will be really helpful to scale the same control and use it on all kind of devices with resolutions ranging from 320 x 180 to 4K UHD displays.

Label for the Gauge range in the RadGauge control.
Apart from the individual points, need ability to name the range.

Implement autoscale functionality to RadGauge

Currently only BarIndicator and Arrow are available. A line with contrasting color over the track, a double arrow, a circle, etc. can be other shapes built-in in the control.

Currently the skins of the RadGauge contain predefined colors for the cap, pointer, track, major/minor ticks, scale labels and rangeplaceholder. Add the predefined colors for the ranges in the skins as well.

Similar to kendo gauge's functionality:

http://demos.telerik.com/kendo-ui/linear-gauge/multiple-pointers

http://demos.telerik.com/kendo-ui/radial-gauge/multiple-pointers