http://demos.telerik.com/aspnet-ajax/htmlchart/examples/charttypes/columnchart/defaultcs.aspx
Try it with Stacked mode checked and minvalue set to 5000 on Y settings!

Hi,

MissingValue set to Gap or Zero doesn't work in RadHtmlChart with ScatterLineSeries.

Interpolation is done instead.

              <telerik:RadHtmlChart runat="server">
                    <PlotArea>
                        <Series>
                            <telerik:ScatterLineSeries Name="Test" DataFieldX="XValue"
                                DataFieldY="YValue" MissingValues="Gap">
                                <SeriesItems>
                                    <telerik:ScatterSeriesItem X="1" Y="8" />
                                    <telerik:ScatterSeriesItem X="2" Y="9" />
                                    <telerik:ScatterSeriesItem X="3" Y="4" />
                                    <telerik:ScatterSeriesItem X="4" Y="6" />
                                    <telerik:ScatterSeriesItem X="5" Y="7" />
                                    <telerik:ScatterSeriesItem X="8" Y="1" />
                                    <telerik:ScatterSeriesItem X="9" Y="5" />
                                    <telerik:ScatterSeriesItem X="10" Y="4" />
                                </SeriesItems>
                            </telerik:ScatterLineSeries>
                        </Series>
                    </PlotArea>
                </telerik:RadHtmlChart>


The workaround described in the following link doesn't work either :
https://feedback.telerik.com/Project/108/Feedback/Details/44399-fix-the-functionality-of-the-missingvalue-property-when-set-to-gap-in-areaserie

Can you please fix this bug ?

Thanks and regards.

The current behavior of the RadHtmlChart preserves only the bound datasource, however it doesn't store programmatically added series items after a postback.

The workaround is instead of creating and adding series items programmatically, create a datatable and pass it as a datasource to the chart. For example:
ASPX:
<telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Width="600px" Height="400px">
</telerik:RadHtmlChart>
C#:
protected void Page_Load(object sender, EventArgs e)
{
    DataTable dt = new DataTable();
    dt.Columns.Add("id");
    dt.Columns.Add("xValues");
    dt.Columns.Add("yValues");
    for (int i = 0; i < 5; i++)
    {
        dt.Rows.Add(i, (10 + i).ToString() + " Apr", 20 + i);
    } 
    ScatterLineSeries sls1 = new ScatterLineSeries();
    sls1.LabelsAppearance.DataFormatString = "{0:d}";
    sls1.DataFieldX = "xValues";
    sls1.DataFieldY = "yValues";
  
    RadHtmlChart1.PlotArea.Series.Add(sls1);
    RadHtmlChart1.DataSource = dt;
    RadHtmlChart1.DataBind();
}

Currently the Hay skin sets white color for the  title, axes labels and legend in RadHtmlChart.
For the time being the color of the mentioned elements can be changed through the TextStyle property - http://www.telerik.com/help/aspnet-ajax/htmlchart-appearance-labels-titles-font-settings.html.

Adding a Radar chart type will be a nice improvement in RadHtmlChart.

Issue is reproducible with the following code:
        <telerik:RadHtmlChart runat="server" ID="ColumnChart1" Width="600px" Height="400px">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries Name="Product 1">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="10" />
                            <telerik:CategorySeriesItem Y="8" />
                        </SeriesItems>
                        <LabelsAppearance Position="Center"></LabelsAppearance>
                    </telerik:ColumnSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>
For the time being you can change the labels position from "Center" to "OutsideEnd".

The property will control the distance between the corresponding series items.

For the time being you can workaround this behavior as follows:
  1)Place all of the items within a common series.
  2)Use different colors for items in order to distinguish them from their original series.
  3)Create a custom legend if needed one.

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

Would be nice to be able to supply an image for the series background on bar and column charts, this would enable infographic style option to charts, i.e. displaying data for countries the bar series can be repeating national flags.

For the time being the property can be set through the kendo widget:
		<script type="text/javascript">
			function pageLoad() {
				var kendoWidget = $find("<%=RadHtmlChart1.ClientID%>").get_kendoWidget();
				kendoWidget.options.series[0].color = function (e) {
					if (e.value > 20) {
						return "red";
					}
					else {
						return "green";
					}
				}
				kendoWidget.redraw();
			}
		</script>
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries>
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>

If the type of the XAxis is category the field from the data source used for the XAxis must not be tried to be parsed to DateTime format.

For the time being the issue can be workaround as follows:

-Either set an appropriate DataFormatString for the XAxis labels. For example:

        <telerik:RadHtmlChart ID="ColumnChart" runat="server" Width="600" Height="400">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries DataFieldY="yValues">
                    </telerik:ColumnSeries>
                </Series>
                <XAxis DataLabelsField="xLabels" Type="category">
                    <LabelsAppearance DataFormatString="d - MM"></LabelsAppearance>
                </XAxis>
            </PlotArea>
        </telerik:RadHtmlChart>

- OR add the XAxis items manually from the data source:

ASPX:

        <telerik:RadHtmlChart ID="ColumnChart" runat="server" Width="600" Height="400">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries DataFieldY="yValues">
                    </telerik:ColumnSeries>
                </Series>
                <XAxis DataLabelsField="xLabels" Type="category">
                    <LabelsAppearance></LabelsAppearance>
                </XAxis>
            </PlotArea>
        </telerik:RadHtmlChart>
C#:

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

        DataTable currDT = GetData();
        for (int i = 0; i < currDT.Rows.Count; i++)
        {
            AxisItem currItem = new AxisItem(currDT.Rows[i]["xLabels"].ToString());
            ColumnChart.PlotArea.XAxis.Items.Add(currItem);
        }
    }

    protected DataTable GetData()
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("yValues");
        dt.Columns.Add("xLabels");

        dt.Rows.Add(10, "1 - 10");
        dt.Rows.Add(30, "2 - 11");
        dt.Rows.Add(20, "3 - 12");

        return dt;
    }

I would like to suggest ability to display data series in doughnut and pie charts, see attached example from Excel.

And thanks for a great Telerik experience, you make my development work very easy.

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.

The selection (http://demos.telerik.com/kendo-ui/chart-api/selection) can be configured through the kendo widget:
		<script>
			function pageLoad(args) {
				var kendoWidget = $find("<%=RadHtmlChart1.ClientID%>").get_kendoWidget();
				kendoWidget.options.categoryAxis.select = { from: 1, to: 2 };
				kendoWidget.bind("selectStart", onSelectStart);
				kendoWidget.bind("select", onSelect);
				kendoWidget.bind("selectEnd", onSelectEnd);

				kendoWidget.redraw();
			}

			function formatRange(e) {
				var categories = e.axis.categories;

				return kendo.format("{0} - {1} ({2} - {3})",
					e.from, e.to,
					categories[e.from],
					// The last category included in the selection is at (to - 1)
					categories[e.to - 1]
				);
			}

			function onSelectStart(e) {
				console.log(kendo.format("Select start :: {0}", formatRange(e)));
			}

			function onSelect(e) {
				console.log(kendo.format("Select :: {0}", formatRange(e)));
			}

			function onSelectEnd(e) {
				console.log(kendo.format("Select end :: {0}", formatRange(e)));
			}
		</script>
		<telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Width="600px" Height="400px">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Product 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="1" />
							<telerik:CategorySeriesItem Y="2" />
							<telerik:CategorySeriesItem Y="3" />
							<telerik:CategorySeriesItem Y="4" />
							<telerik:CategorySeriesItem Y="2" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
				<XAxis>
					<Items>
						<telerik:AxisItem LabelText="1" />
						<telerik:AxisItem LabelText="2" />
						<telerik:AxisItem LabelText="3" />
						<telerik:AxisItem LabelText="4" />
						<telerik:AxisItem LabelText="5" />
					</Items>
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>

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 

A visual example - http://i.stack.imgur.com/zRwlo.jpg

The feature will be useful for projects that need 508 compliance.

A boolean properties will also be useful: "EnabledTexturedFill", "EnableColorAndTexturedFill"