A good improvement in the RadHtmlChart would be to add MaxSize and MinSize properties for the series, which would allow the control the scaling of the bubble chart item. The property can be set through the chartObject:

        <script>
            function pageLoad() {
                var chart = $find("<%=BubbleChart.ClientID%>");
                chart.get_kendoWidget().options.series[0].minSize = 1;
                chart.get_kendoWidget().options.series[0].maxSize = 10;
                chart.get_kendoWidget().redraw();
            }
        </script>
        ASPX:
        <telerik:RadHtmlChart runat="server" ID="BubbleChart" Width="500" Height="400">
            <PlotArea>
                <Series>
                    <telerik:BubbleSeries>
                        <Appearance FillStyle-BackgroundColor="#6ab2c9">
                        </Appearance>
                        <SeriesItems>
                            <telerik:BubbleSeriesItem Size="1" X="5" Y="5500" />
                            <telerik:BubbleSeriesItem Size="5" X="14" Y="12200" />
                            <telerik:BubbleSeriesItem Size="15" X="20" Y="39000" />
                        </SeriesItems>
                    </telerik:BubbleSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>


More detailed information regarding these properties can be found in the API reference of the Kendo UI Chart here:
http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-series.maxSize

For the time being you can use the following JavaScript workaround:

		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="300">
			<PlotArea>
				<Series>
					<telerik:LineSeries Name="series 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="25" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:LineSeries>
				</Series>
				<XAxis MinValue="1">
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>
		<script>

                       //JavaScript workaround

			function isNumber(val) {
				return typeof val === "number" && !isNaN(val);
			}


			var dataviz = kendo.dataviz,
				inArray = dataviz.inArray,
				deepExtend = kendo.deepExtend,
				math = Math,
				AREA = "area",
				VERTICAL_AREA = "verticalArea",
				VERTICAL_LINE = "verticalLine",
				LINE = "line";

			kendo.dataviz.CategoricalPlotArea.fn.filterSeries = function (currentSeries, categoryAxis) {
				var range = categoryAxis.totalRangeIndices();
				var justified = categoryAxis.options.justified;
				var outOfRangePoints = inArray(currentSeries.type, [LINE, VERTICAL_LINE, AREA, VERTICAL_AREA]);
				var categoryIx;

				range.min = isNumber(categoryAxis.options.min) ? math.floor(range.min) : 0;
				range.max = isNumber(categoryAxis.options.max) ? (justified ? math.floor(range.max) + 1 : math.ceil(range.max)) : currentSeries.data.length;

				currentSeries = deepExtend({}, currentSeries);

				if (outOfRangePoints) {
					var minCategory = range.min - 1;
					var srcCategories = categoryAxis.options.srcCategories || [];
					if (minCategory >= 0 && minCategory < currentSeries.data.length) {
						categoryIx = minCategory;
						currentSeries._outOfRangeMinPoint = {
							item: currentSeries.data[categoryIx],
							category: srcCategories[categoryIx],
							categoryIx: -1
						};
					}

					if (range.max < currentSeries.data.length) {
						categoryIx = range.max;
						currentSeries._outOfRangeMaxPoint = {
							item: currentSeries.data[categoryIx],
							category: srcCategories[categoryIx],
							categoryIx: range.max - range.min
						};
					}
				}

				categoryAxis._seriesMax = math.max(categoryAxis._seriesMax || 0, currentSeries.data.length);

				currentSeries.data = (currentSeries.data || []).slice(range.min, range.max);

				return currentSeries;
			}
		</script>

Hi! I don't know if could be a other type for the html chart control. I want a donut with only 2 series like a points in a exam for example 100/120 and the points 100 shows in the center of the donut, maybe I would like to change the 100 points with a image 

The current implementation of RadHtmlChart explicitly specifies font-family and font-size settings on the server-side, which are then serialized and used by the Kendo widget, so the skin-specific settings are ignored.

For example, the Material skin should define a "Roboto" font-family, but this is overriden by "Arial" in the final serialization, so the skin configuration does not have any effect.

The default values of the server-side font settings can be removed in order to allow such customization and can be defined in the skins file instead.

Is there any plans to add a Server Side series click event in RadHTMLChart? Currently it is only available via the Client side.

 Workaround use padding instead of margin:
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server"  Width="600px" Height="400px">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Product 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="15000" />
							<telerik:CategorySeriesItem Y="-4000" />
							<telerik:CategorySeriesItem Y="10000" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
				<XAxis>
					<LabelsAppearance RotationAngle="45">
						<TextStyle Padding="135 0 0 0" />
					</LabelsAppearance>
					<Items>
						<telerik:AxisItem LabelText="item1" />
						<telerik:AxisItem LabelText="item2" />
						<telerik:AxisItem LabelText="item3" />
					</Items>
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>

It would be helpful to have a way to set the major tick step value via the RadHtmlChart control.  This can be set on the client side, but it seems like a missing feature since I can change the major tick size and label step values via the control axis attributes.  Here's an example with my suggested attribute shown in comments on the xAxis below.

<telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" DataSourceID="RequestDays">
    <ClientEvents OnLoad="OnLoad" />
    <PlotArea>
		<Series>
            <telerik:AreaSeries Name="Last Year" DataFieldY="Last"></telerik:AreaSeries>
            <telerik:AreaSeries Name="Current Year" DataFieldY="Current"></telerik:AreaSeries>
        </Series>
        <XAxis Name="Days" DataLabelsField="Days" MajorTickSize="5"> <%--MajorTickStep="7"--%>
            <LabelsAppearance Step="14" /> 
		</XAxis>
    </PlotArea>
</telerik:RadHtmlChart>

<script type="text/javascript">
        function OnLoad(chart) {
            var widget = chart.get_kendoWidget();
            widget.options.categoryAxis.majorTicks = { step: 7 };
            widget.redraw();
        }
    </script>

               <script>
			function chartLoad() {
				$find("RadHtmlChart2").get_kendoWidget().setOptions({
					legend: {
						position: "top",
						width: 162,
						height: 88,
						orientation: "vertical"
					}
				})
			}
		</script>
		<telerik:RadHtmlChart ID="RadHtmlChart2" runat="server" Width="350" Height="350">
			<ClientEvents OnLoad="chartLoad" />
			...
		</telerik:RadHtmlChart>

Code that reproduces the issue:

<telerik:RadHtmlChart runat="server" ID="RadHtmlChartColumnGender" Transitions="true" Width="150" Height="300">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Male" Stacked="true" StackType="Stack100">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="69" />
						</SeriesItems>
					</telerik:ColumnSeries>
					<telerik:ColumnSeries Name="Female" Stacked="true" StackType="Stack100">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="3" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
				<YAxis NarrowRange="false"></YAxis>
			</PlotArea>

		</telerik:RadHtmlChart>

Workaround:

		<script>
			function pageLoad() {
				var kendoChart = $find("RadHtmlChartColumnGender").get_kendoWidget();
				var valueAxis = kendoChart.options.valueAxis;
				valueAxis.narrowRange = false;
				$find("RadHtmlChartColumnGender").setOptions({valueAxis: valueAxis});
			}
		</script>

Update data values using drag and drop directly from the chart, something like this:

https://forio.com/app/powersim/powerwall/energy_consumption_details.html

A lot of customers would have this functionality without changing the HTMLChart controls.

My objective is to compare product revenue over time. This I would like to achieve using data binding. I do not have information of product names or have the product names as columns. My data table structure is having three columns:

Date
Product Name
Revenue

This I should simply be able to achieve using data binding to a table with above three columns. 
In result I expect each of the Product Names to appear as independent series with revenues plotted on different dates.

A similar graph is displayed in the Line Chart documentation for RadHtmlChart.
https://docs.telerik.com/devtools/aspnet-ajax/controls/htmlchart/chart-types/line-chart

Label position dynamic. I'm currently using "InsideBase", but if those values are so small it's not very visible, so i'd like place those on the outside end.

Hello, 

I would like to highlight a GridLine based on a Labelled item when I have implemented skip in the HTML Chart. 

Essentially, I have a series of days and would like to step the labels on a weekly basis. At each step I would like to highlight the GridLine associated with the label.

Problem appers with x-axis if you try to zoom. 

Chart without zoom: https://drive.google.com/file/d/1Nem_NctJN5WtzypS8JgZTtIuAARGFQbd/view?usp=sharing

Chart with some zoom: https://drive.google.com/file/d/1TRJZX3FI52YXyuWgB_kpkMTWWXKecVC_/view?usp=sharing

Project included.

The charts starts to perform zooming when the user pans with one finger in touch devices.

Steps to reproduce:

1. Open the following demo in a touch device (or Chrome simulator)

    https://demos.telerik.com/aspnet-ajax/htmlchart/examples/functionality/pan-zoom/defaultcs.aspx

2. Start panning until the zooming issue occurs

Video: http://somup.com/cr6lo73b73 

Hovering or clicking on the series name in the legend will highlight or toggle the visibility of the series.