For the time being the following events can be handled through the chartObject.
-drag event is fired when the plot area of the main chart is dragged.
-zoom event is fired when the mouse wheel is used in the plot area of the main chart.
-select event is fired when the range of the selector from the navigator pane is changed.

JavaScript:

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script>
            function OnLoad(sender) {
                var chart = sender;
                chart._chartObject.bind("dragEnd", OnDragEnd);
                chart._chartObject.bind("selectEnd", OnSelectEnd);
                chart._chartObject.bind("zoom", OnZoom);
            }
            function OnDragEnd(e) {
                alert("OnDragEnd triggered: \nMin: " + e.axisRanges['mainAxis'].min + "\n Max: " + e.axisRanges['mainAxis'].max);
            }
            function OnSelectEnd(e) {
                alert("OnSelectEnd triggered: \nFrom: " + e.from + "\n To: " + e.to);
            }
            function OnZoom(e) {
            
                alert("OnZoom triggered: \nMin: " + e.axisRanges['mainAxis'].min + "\n Max: " + e.axisRanges['mainAxis'].max);
            }
        </script>
    </telerik:RadCodeBlock>
ASPX:

        <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Layout="Stock" Width="800" Height="400"
            Transitions="true">
            <ClientEvents OnLoad="OnLoad" />
            <PlotArea>
                <XAxis Name="mainAxis" DataLabelsField="SellDate" Type="Date">
                </XAxis>
                <Series>
                    <telerik:ColumnSeries DataFieldY="SellQuantity">
                    </telerik:ColumnSeries>
                </Series>
            </PlotArea>
            <Navigator Visible="true">
                <XAxis Name="navAxis"></XAxis>
                <SelectionHint Visible="true" />
                <Series>
                    <telerik:AreaSeries DataFieldY="SellQuantity">
                    </telerik:AreaSeries>
                </Series>
            </Navigator>
        </telerik:RadHtmlChart>

C#:

    protected void Page_Load(object sender, EventArgs e)
    {
        RadHtmlChart1.DataSource = GetData();
        RadHtmlChart1.DataBind();
    }

    protected DataTable GetData()
    {
        DataTable dt = new DataTable();

        dt.Columns.Add("ID", typeof(int));
        dt.Columns.Add("SellQuantity", typeof(int));
        dt.Columns.Add("SellDate", typeof(DateTime));

        dt.Rows.Add(1, 2, new DateTime(2011, 06, 12));
        dt.Rows.Add(1, 5, new DateTime(2011, 12, 12));
        dt.Rows.Add(2, 6, new DateTime(2012, 06, 17));
        dt.Rows.Add(3, 4, new DateTime(2012, 09, 18));
        dt.Rows.Add(4, 7, new DateTime(2013, 03, 18));

        return dt;
    }

The property indicates whether the series name will be visible in the legend. For the time being the following workaround can be used:

JavaScript:

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script>
            function pageLoad() {
                var chart = $find("<%=RadHtmlChart1.ClientID%>");
                chart.get_kendoWidget().options.series[0].visibleInLegend = false;
                chart.get_kendoWidget().options.series[1].visibleInLegend = true;
                chart.repaint();
            }
        </script>
    </telerik:RadCodeBlock>

ASPX:

        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries Name="Series 1">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="1" />
                            <telerik:CategorySeriesItem Y="2" />
                        </SeriesItems>
                    </telerik:ColumnSeries>
                    <telerik:ColumnSeries Name="Series 2">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="3" />
                            <telerik:CategorySeriesItem Y="4" />
                        </SeriesItems>
                    </telerik:ColumnSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>

For the time being the following workaround can be used:    

Category Axis:

JavaScript:

  <script>
            function pageLoad() {
                var chart = $find("<%=RadHtmlChart1.ClientID%>");
                chart._chartObject.options.categoryAxis.labels.template = "Item: #=value#";
                chart.repaint();
            }
        </script>

ASPX:

       <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="300">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries Name="series 1">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="30" />
                            <telerik:CategorySeriesItem Y="10" />
                            <telerik:CategorySeriesItem Y="25" />
                            <telerik:CategorySeriesItem Y="20" />
                        </SeriesItems>
                    </telerik:ColumnSeries>
                </Series>
                <XAxis>
                    <Items>
                        <telerik:AxisItem LabelText="1" />
                        <telerik:AxisItem LabelText="2" />
                        <telerik:AxisItem LabelText="3" />
                        <telerik:AxisItem LabelText="4" />
                    </Items>
                </XAxis>
            </PlotArea>
        </telerik:RadHtmlChart>

Numeric Axis:
        <script>
            function changeValues(value) {
                var newValue;
                switch (value) {
                    case 1:
                        newValue = "AA";
                        break;
                    case 2:
                        newValue = "BB";
                        break;
                    case 3:
                        newValue = "CC";
                        break;
                    case 4:
                        newValue = "DD";
                        break;
                    default:
                        newValue = value;
                }
                return newValue;
            }
            function pageLoad() {
                var chart = $find("<%=RadHtmlChart1.ClientID%>");
                chart._chartObject.options.xAxis.labels.template = "#=changeValues(value)#";
                chart.repaint();
            }
        </script>
        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="300">
            <PlotArea>
                <Series>
                    <telerik:ScatterLineSeries Name="series 1">
                        <SeriesItems>
                            <telerik:ScatterSeriesItem Y="30" X="1" />
                            <telerik:ScatterSeriesItem Y="10" X="2" />
                            <telerik:ScatterSeriesItem Y="25" X="3" />
                            <telerik:ScatterSeriesItem Y="20" X="4" />
                        </SeriesItems>
                    </telerik:ScatterLineSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>

For the time being the following workaround can be used:

JavaScript:

    <script>
        function pageLoad() {
            var chart = $find("<%=RadHtmlChart1.ClientID%>");
            chart.get_kendoWidget().options.valueAxis.labels.template = "#if(value > 20) {# Value #=value# is a good option#} else {# value below 20 is a bad option #}#";
            chart.repaint();
        }
    </script>

ASPX:


        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="300">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries Name="series 1">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="30" />
                            <telerik:CategorySeriesItem Y="10" />
                            <telerik:CategorySeriesItem Y="25" />
                            <telerik:CategorySeriesItem Y="20" />
                        </SeriesItems>
                    </telerik:ColumnSeries>
                </Series>
                <YAxis>
                    <LabelsAppearance DataFormatString="dd{0}">
                    </LabelsAppearance>
                </YAxis>
                <XAxis>
                    <Items>
                        <telerik:AxisItem LabelText="item 1" />
                        <telerik:AxisItem LabelText="item 2" />
                        <telerik:AxisItem LabelText="item 3" />
                        <telerik:AxisItem LabelText="item 4" />
                    </Items>
                </XAxis>
            </PlotArea>
        </telerik:RadHtmlChart>

The options for positioning a legend in a RadHtmlChart are somewhat limited. Useful extensions:

1. Support Left/Center/Right options for legends positioned at top and bottom; support Top/Middle/Bottom options for legends positioned at left and right.

2. Support positioning legends within the plot area.

For the time being the following workaround can be used:
		<script>
			function pageLoad() {
				var kendoWidget1 = $find("<%=PieChart1.ClientID%>").get_kendoWidget();
				kendoWidget1.options.legend.position = "custom";
				kendoWidget1.options.legend.offsetX = 300;
				kendoWidget1.options.legend.offsetY = 80;
				kendoWidget1.redraw();
			}
		</script>
		<telerik:RadHtmlChart runat="server" ID="PieChart1" Transitions="true">
			<PlotArea>
				<Series>
					<telerik:PieSeries StartAngle="90">
						<LabelsAppearance Position="OutsideEnd" DataFormatString="{0} %" />
						<TooltipsAppearance DataFormatString="{0} %" />
						<SeriesItems>
							<telerik:PieSeriesItem BackgroundColor="Purple" Exploded="true" Name="Internet Explorer" Y="18.3" />
							<telerik:PieSeriesItem BackgroundColor="Orange" Exploded="false" Name="Firefox" Y="35.8" />
							<telerik:PieSeriesItem BackgroundColor="Green" Exploded="false" Name="Chrome" Y="38.3" />
							<telerik:PieSeriesItem BackgroundColor="Blue" Exploded="false" Name="Safari" Y="4.5" />
							<telerik:PieSeriesItem BackgroundColor="Red" Exploded="false" Name="Opera" Y="2.3" />
						</SeriesItems>
					</telerik:PieSeries>
				</Series>
			</PlotArea>
			<ChartTitle Text="Browser Usage for April 2012">
			</ChartTitle>
		</telerik:RadHtmlChart>

For the time being the following workaround can be used:

JavaScript:

    <script>
        function pageLoad() {
            var chart = $find("<%=RadHtmlChart1.ClientID%>");
            chart._chartObject.options.series[0].labels.background = "yellow";
            chart._chartObject.options.series[0].labels.border = {
                width: 2,
                dashType: "dashDot",
                color: "green"
            };
            chart.repaint();
        }
    </script>

ASPX:

        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries>
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="10" />
                            <telerik:CategorySeriesItem Y="30" />
                            <telerik:CategorySeriesItem Y="20" />
                            <telerik:CategorySeriesItem Y="25" />
                        </SeriesItems>
                    </telerik:ColumnSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>

For the time being the following workaround can be used:
JavaScript:
	<script>
		function pageLoad() {
			var pieChart = $find('<%=PieChart1.ClientID%>');
			pieChart._chartObject.options.seriesDefaults.labels.distance = 10;
			pieChart.repaint();
		}
	</script>
ASPX:
		<telerik:RadHtmlChart runat="server" ID="PieChart1" Width="300" Height="300">
			<PlotArea>
				<Series>
					<telerik:PieSeries>
						<SeriesItems>
							<telerik:PieSeriesItem Name="Item 1" Y="18.3"></telerik:PieSeriesItem>
							<telerik:PieSeriesItem Name="Item 2" Y="35.8"></telerik:PieSeriesItem>
							<telerik:PieSeriesItem Name="Item 3" Y="38.3"></telerik:PieSeriesItem>
						</SeriesItems>
					</telerik:PieSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>

When an item's value is equal to zero in a Bar or Column series,, its labels is not shown.

I would like the ability to set a gradient for the plot area of the RadHtmlChart control, instead of just being able to set a solid color.  Thanks!

A good improvement in RadHtmlChart would be the introduction of Waterfall series.

Currently there is some space between the PlotArea and the starting/ending points of the LineSeries in RadHtmlChart.
To changethat behavior, so that it is similar to the one in AreaSeries  the justified property (https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart/configuration/categoryaxis.justified) can be set through the underlying Kendo Chart widget:

        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script>
                function onLoad(sender) {
                    var chart = sender.get_kendoWidget();
                    var opts = chart.options;
                    opts.categoryAxis.justified = true;
                    chart.setOptions(opts);
                    chart.redraw();
                }
            </script>
        </telerik:RadCodeBlock>
        <telerik:RadHtmlChart runat="server" ID="LineChart" Width="800" Height="500" Transitions="true">
            <ClientEvents OnLoad="onLoad" />
            <PlotArea>
                <Series>
                    <telerik:LineSeries Name="Week 15" MissingValues="Interpolate">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="15" />
                            <telerik:CategorySeriesItem Y="23" />
                            <telerik:CategorySeriesItem />
                            <telerik:CategorySeriesItem Y="71" />
                            <telerik:CategorySeriesItem Y="93" />
                            <telerik:CategorySeriesItem Y="43" />
                            <telerik:CategorySeriesItem Y="23" />
                        </SeriesItems>
                    </telerik:LineSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>

Currently BaseUnit property for DateAxes in RadHtmlChart accepts the following values - year, months, days, hours and minutes. Improve this property by adding seconds, weeks and auto.

It would be great to have this new chart type.

A JS error is thrown when a RadHtmlChart is databound and there are series items with null values that correspond to DateTime values on the XAxis. 

The issue could be handled in the following way:
Check if there is a series item's value that is null and if this is the case then do not add it to the datasource

I know that does not support RADHTMLCHART Marked Zone. But somehow I need to make a mark, for example in the SeriesLine that Saturdays and Sundays this line with another color.
I leave a picture so you can understand.
I need the part or series values Y  Vier and Sab will be anothe color. for examples both series at orange color.

I thank you for the attention.
regards

The property for each series could be RenderInPlotArea=true|false
It will control whether the series will be rendered in the plot area, if set to false the series name will still be present in the legend, but grayed out, as if the end user has clicked it already to hide the series in the browser. This will give the developer programmatic contol over the initial state of the chart that the end user can modify later.
For the time being the following workaround can be used:
JavaScript:
	<script>
		function pageLoad() {
			var chart = $find("<%=RadHtmlChart1.ClientID%>");
			chart._chartObject.options.series[0].visible = false;
			chart.repaint();
		}
	</script>
ASPX:
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Series 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:ColumnSeries>
					<telerik:ColumnSeries Name="Series 2">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="5" />
							<telerik:CategorySeriesItem Y="12" />
							<telerik:CategorySeriesItem Y="8" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>

Currently when numerous series items are present, numerical series (Scatter/ScatterLine) calculates automatically the step through which the major/minor gridlines and the corresponding xaxis labels are rendered, so that they are visually readable.

For categorical charts, however, when multiple series items are present, all the xaxis labels are plotted, so that they are not readable. Add ability to autoadjust the step for the xaxis labels in categorical charts.

Currently the available appearance options of the line in Area, Line and ScatterLine Series are width and background color. Expose additional option for changing the dash type(e.g. dash, dashDot, Dot, etc). For the time being the following workaround can be used:
		<script>
			function pageLoad() {
				var chart = $find("<%=RadHtmlChart1.ClientID%>");
				//DashType: dash, dashDot, dot, longDash, longDashDot, longDashDotDot, solid
				chart._chartObject.options.series[0].dashType = "dot";
				chart.repaint();
			}
		</script>
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600px" Height="400px">
			<PlotArea>
				<Series>
					<telerik:LineSeries Name="Series 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:LineSeries>
				</Series>
				<XAxis>
					<Items>
						<telerik:AxisItem LabelText="item 1" />
						<telerik:AxisItem LabelText="item 2" />
						<telerik:AxisItem LabelText="item 3" />
					</Items>
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>